ng-hide가 작동하지 않습니다.

Question

나는 angularjs를 처음 사용합니다. "Click Me"를 클릭하면 toggle 메서드가 호출됩니다. test의 값은 false에서 true로 변경되지만 ng-hide은 test의 새 값을 확인하지 않습니다.

<div ng-app="myApp" ng-controller="myCtrl"> 
<table> 
<tr> 
    <td><span ng-hide="{{test}}">Testing</**strong text**td> 
    <td><span>hello</span></td> 
</tr> 
<tr> 
    <td style="cursor:pointer"><span ng-click="toggle()">Click Me</td> 
    <td><span>hello</span></td> 
</tr> 
</table> 
</div> 

script.js

var appX = angular.module('myApp', []); 
appX.controller('myCtrl', function($scope){ 
    $scope.test = false; 
    $scope.toggle = function(){ 
    $scope.test = true; 
    console.log("toggle is working"); 
    }; 
}); 

Answer 1

테스트가 발현되지 않으므로 중괄호 제거

<td><span ng-hide="test">Testing</**strong text**td> 

Answer 2

그 구문 오류. 표현식 바인딩과 지시문 바인딩을 결합합니다. 아래 코드가 작동해야합니다.

은 ng-hide-"test"

Answer 3

와 ngHide 지시자 쇼 ng-hide="{{test}} 교체하거나 ngHide 특성에 제공하는 식에 기초하여 상기 지정된 HTML 요소를 숨긴다.

표현을 허용하므로 중괄호가 필요하지 않습니다!

변경 : 지시어는 속성 값으로 string 대신 expression을 기대 경우

ng-hide="{{test}}" 

ng-hide="test" 

에 당신은 중괄호를 사용할 필요가있다.

자세한 내용은 Angular Docs을 참조하십시오.

Answer 4

이미 각도 지시어이므로 ng-hide 안에 각도 코드를 쓰고 있다고 말할 필요는 없습니다. test 변수 자체를 설계하므로 거기에 중괄호를 제공 할 필요가 없습니다. ng-hide="test"

Answer 5

일부 코드 변경 :

단순히 같은 시도 당신은 </span>

<span ng-hide="test">Testing</span> 

닫는 </td> 요소에서 **strong text**를 제거 닫습니다 잊어

• .

  <td><span ng-hide="test">Testing</span></td> 
  

• 엉덩이 test가 표현하지, Sajeetharan에 의해 제안 때문에 중괄호를 제거합니다.

  <td><span ng-hide="test">Testing</span></td> 
  

근무 데모 :

var myApp = angular.module('myApp',[]); 
 

 
myApp.controller('MyCtrl', function($scope) { 
 
    $scope.test = false; 
 
    $scope.toggle = function(){ 
 
    $scope.test = true; 
 
    console.log("toggle is working"); 
 
    }; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="MyCtrl"> 
 
    <table> 
 
<tr> 
 
<td><span ng-hide="test">Testing</span></td> 
 
    <td><span>hello</span></td> 
 
</tr> 
 
<tr> 
 
<td style="cursor:pointer"><span ng-click="toggle()">Click Me</span></td> 
 
    <td><span>hello</span></td> 
 
</tr> 
 
</table> 
 
</div>