我可以使用 ng-click 和 ng-if 同时隐藏和显示两个不同的部分吗?



我正在用angularjs开发一个应用程序,并试图直接在DOM中做一些事情。虽然我知道这不是最好的做法,但在这种情况下它会非常实用,因为我专门试图绕过控制器。 我尝试将一个按钮连接到 ng-click 中,其中包含两个函数 true 和 false,然后使用 ng-if 显示和隐藏一个部分。 两个函数,因为有两个部分。 我想把它放在一个按钮上,如果单击一个按钮,一个部分显示,而另一个部分隐藏,反之亦然。它有点工作,但它永远不会隐藏第一部分。此外,在某些尝试中,我让它工作了,但它不会默认为加载中的任何一个元素。 有什么想法吗?我的代码看起来像这样:

<button class="add col-xs-6 col-sm-6 col-md-3 col-lg-3 add-btn" ng-model="showThis=true" ng-click="showMe=false; showThis=true">Add</button>
<button class="edit col-xs-6 col-sm-6 col-md-3 col-lg-3 edit-btn" ng-click="showMe=true; showThis=false">Edit</button>
<div ng-if="showThis">
{A Section of Code}
</div>
<div ng-if="showME">
{Another Section of Code}
</div>

我会设置一个变量,然后使用它在两个div之间切换:

<button class="add col-xs-6 col-sm-6 col-md-3 col-lg-3 add-btn" ng-model="showMe=true" ng-click="showMe=false">Add</button>
<button class="edit col-xs-6 col-sm-6 col-md-3 col-lg-3 edit-btn" ng-click="showMe=true">Edit</button>
<div ng-if="showMe">
{A Section of Code}
</div>
<div ng-if="!showMe">
{Another Section of Code}
</div>

如果 showMe 为 true,则会显示顶部块,而 ! 或 NOT 运算符将隐藏第二个块(!true == false(。

最新更新