지시문 내 ng-show에서 AngularJS보기가 업데이트되지 않습니다.

Question

앵커 태그를 mouseover 할 때 iconVisible 변수가 업데이트되지만 참인 것으로 평가 되더라도보기가 실행되지 않습니다. 누구나 쉽게 문제를 해결할 수있는 방법을 알고 있지만 몇 시간 동안 나를 괴롭 히고 있습니다.

참고 : 내가 달성하려고하는 것은 표시 할 링크가 onmouseover 링크이지만 불필요한 것들을 제거했습니다.

angular.module('App.header', []) 
.controller('HeaderController', function ($scope) { 

}) 
.directive('menu', function() { 
    return { 
     restrict:'EA', 
     replace:true, 
     transclude:true, 
     template:'<ul ng-transclude></ul>', 
     scope:{ 

     }, 
     link: function (scope, el, attr) { 

     } 
    } 
}) 
.directive('menuItem', function() { 
    return { 
     restrict:'EA', 
     replace:true, 
     transclude:true, 
     template:'<li><a href="#" ng-transclude ng-mouseover="showIcon()"></a><img src="#" alt="" ng-show="{{iconVisible}}"/></li>', 
     controller: function ($scope) { 
      $scope.iconVisible = false; 
     }, 
     scope:{ 

     }, 
     link: function (scope, el, attr) { 
      scope.showIcon = function() { 
       scope.iconVisible = !scope.iconVisible; 
      } 
     } 
    } 
}) 

<header class="container" ng-controller="HeaderController"> 
<menu> 
    <menu-item>Home</menu-item> 
</menu> 

Answer 1

당신이 = "true"로

주어진

NG-쇼에 변환을 쓴 것은 $ scope.true은 정의되지 않은 것을 기본적으로 ng-show="iconVisible"

와 ng-show="{{iconVisible}}" 교체 , ng-show에는 요소가 표시되지 않습니다.