ng-show not working properly in angularjs -
i want show element based on value of property inside controller.
ereaderbook.directive("controltools", function () { return { replace : true, restrict : "e", templateurl : "assets/directives/controlstools.html", controller : function ($scope) { $scope.visible = false; }, link : function (scope, el, attr) { el.bind("mouseover",function() { console.log(scope.visible) scope.visible = true; }); el.bind("mouseout",function() { console.log(scope.visible) scope.visible = false; }) } };
});
<div class="menuitem"><span class="glyphicon glyphicon-search"></span><span ng-show="visible" class="menutext">toc</span></div>
inside directive have controller defined $scope.visible = false
. works fine on page load. want change state $scope.visible = true
on mouseover
, $scope.visible = false
on mouseout
. why scope.visible = true;
not affect ng-show
?
you forgot add scope: true responsible share scope. return { replace: true, restrict: "e", scope: true, templateurl: "assets/directives/controlstools.html",
Comments
Post a Comment