ng在AngularJS中点击显示

ng-show on click in AngularJS

本文关键字：显示 AngularJS ng      更新时间：2023-09-26

当用户单击图标时，我很难让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>

此语法不正确：

ng-show="showMe = true"

计算时，它会将true指定给字段"showMe"。

你应该放：

ng-show="showMe"

这不会解决您的问题，因为字段"showMe"未初始化为true。

所以你可以颠倒你的逻辑：

<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。

我想你想要这个：

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

您将showMe设置为true，而不是检查它是否设置为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>

您想要的是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/

相关文章：