i trying make simple app angular , can't seem figure how hide content when click links in navigation bar
<body ng-controller="mainctrl"> <div class="navbar-fixed "> <nav> <div class="nav-wrapper teal lighten-1"> <a href="#" class="brand-logo center waves-effect waves-light" ng-click="template='home.html'"><i class="material-icons">dashboard</i></a> <ul class="left"> <li class="waves-effect waves-light"><a href="#" ng-click="template='discover.html'"><i class="material-icons">search</i></a> </ul> <ul class="right"> <li class="waves-effect waves-light"><a href="#" ng-click="template='profile.html'"><i class="material-icons">perm_identity</i></a> </ul> </div> </nav> </div> <div ng-hide> <h1> must not show</h1> </div> <div ng-include="template"> </div> </body> main controller:
var app = angular.module('testing', []); app.controller('mainctrl', function($scope) { $scope.name = 'world'; }); var classapp = angular.module('classapp', []); classapp.controller('classctrl', function ($scope) { $scope.isactive = false; $scope.activebutton = function() { $scope.isactive = !$scope.isactive; } }); when click middle logo want content of body in case "must not show" should hidden , display template i'm using on body. thanks
you need bind visibility scope variable; show can use:
<a href="#" class="brand-logo center waves-effect waves-light" ng-click="showtemplate('home.html', true)"><i class="material-icons">dashboard</i></a> to hide can use:
<li class="waves-effect waves-light"><a href="#" ng-click="showtemplate('discover.html', false)"><i class="material-icons">search</i></a> in controller define function showtemplate like:
$scope.showtemplate = function(templatename, hidecontent) { $scope.template = templatename; //template show $scope.hidesection = hidecontent; //true or false hide/show content } in function set visible template , hide or how other section. need bind section want hide hidesection variable:
<div ng-hide="hidesection"> <h1> must not show</h1> </div> ng-hide alone without variable bound not work
Comments
Post a Comment