在AngularJS中单击ng-show

Question

我无法在用户单击某个图标时使ng-show正常工作。行为应如下所示：父div加载并显示一些内容。当用户点击播放图标时，div的内容将隐藏起来。但是，现在它似乎并没有工作。请参见下面的代码：

<div class="col-sm-10 col-md-8 center-block" ng-show="showMe = true"> 

     <div class="play"> 
      <span class="icon_play" ng-click="showMe=false"></span> 
     </div> 

</div> 

Answer 1

我想你想要这样的：

<div class="col-sm-10 col-md-8 center-block" ng-show="showMe" ng-init="showMe = true"> 

Answer 2

你设置showMe为真，而不是如果它被设置为true检查。

<div class="col-sm-10 col-md-8 center-block" ng-show="showMe"> 

     <div class="play"> 
      <span class="icon_play" ng-click="showMe=false"></span> 
     </div> 

</div> 

Answer 3

此语法不正确：

ng-show="showMe = true" 

评估后，其分配真正到了现场 'SHOWME'。

你应该把改为：由于现场“SHOWME”未初始化为true

ng-show="showMe" 

这不会解决你的问题。

所以，你可以翻转你的逻辑：

<div class="col-sm-10 col-md-8 center-block" ng-show="!dontShowMe"> 

    <div class="play"> 
     <span class="icon_play" ng-click="dontShowMe=true"></span> 
    </div> 

</div> 

或控制器代码初始化SHOWME。

Answer 4

你想为你的NG-节目，不是赋值表达式。在这里看到的文档： https://docs.angularjs.org/api/ng/directive/ngShow

你想是这样的：

<div class="col-sm-10 col-md-8 center-block" ng-show="showMe"> 

     <div class="play"> 
      <span class="icon_play" ng-click="showMe=false"></span> 
     </div> 

</div> 

http://jsfiddle.net/thomporter/tcVhN/