Angular js ng show
Angular js ng show
单击时,我必须使用角度概念显示一个部分并隐藏另一个部分。
我试过这些
<div data-ng-click="showDetails = ! showDetails">Apps</div>
<div data-ng-click="showDetails1 = ! showDetails1">Favorites</div>
<div data-ng-click="showDetails2 = ! showDetails2">Search</div>
<section id="workbench-search" data-ng-class="{ 'hidden': ! showDetails }">search</section>
<section id="workbench-favorites" data-ng-class="{ 'hidden': ! showDetails1 }">fav</section>
<section id="workbench-apps" data-ng-class="{ 'hidden': ! showDetails2 }">apps</section>
但是onclick并没有隐藏另一个
你能以角度的方式提出建议吗?角度概念的新概念
尝试
<div ng-click="showDetails = !showDetails; showDetails1 = false; showDetails2 = false;">Apps {{showDetails}}</div>
<div ng-click="showDetails1 = !showDetails1; showDetails = false; showDetails2 = false;">Favorites {{showDetails1}}</div>
<div ng-click="showDetails2 = !showDetails2; showDetails = false; showDetails1 = false;">Search {{showDetails2}}</div>
<section id="workbench-search" ng-class="{ 'hidden': !showDetails }">search</section>
<section id="workbench-favorites" ng-class="{ 'hidden': !showDetails1 }">fav</section>
<section id="workbench-apps" ng-class="{ 'hidden': !showDetails2 }">apps</section>
演示:Plunker
这将适用于您。试试这个
<div data-ng-click="showDetails = ! showDetails;showDetails1 = false;showDetails2 = false">Apps</div>
<div data-ng-click="showDetails1 = ! showDetails1;showDetails = false;showDetails2 = false">Favorites</div>
<div data-ng-click="showDetails2 = ! showDetails2;showDetails = false;showDetails1 = false">Search</div>
<section id="workbench-search" data-ng-class="{ 'hidden': ! showDetails }">search</section>
<section id="workbench-favorites" data-ng-class="{ 'hidden': ! showDetails1 }">fav</section>
<section id="workbench-apps" data-ng-class="{ 'hidden': ! showDetails2 }">apps</section>
相关文章:
- 使用angularjs ng Show/ng hide显示和隐藏不同的内容
- 我需要NG-IF/NG-SWITCH还是NG-SHOW&NG-HIDE
- 如何在AngularJS视图中使用promise(ng-show)
- AngularJS:如何使用java脚本函数更改跨度的ng-show条件
- ng show和ng hide don'I don’我一秒钟都不工作
- AngularJS:使用ng-show/hide动态维护下拉列表的3种状态(InProgress、Success、Err
- ng-show内容在页面加载过程中闪烁,尽管它不是真实的,并且ng-cloak不适用于FF
- 如何验证使用 ng-repeat、ng-show(角度)动态创建的输入
- 使ng-show/ng-hide与由Angular之外的外部源修改的localStorage一起工作
- 是否可以使用相同的变量使ng if的行为类似于ng show/ng hide
- angular ng show/ng hide无法正确使用ng bind html
- ng-show / ng-hide / ng-if 不适用于 Angular 指令
- AngularJS在使用ng-show ng-hide时,我仍然看到这两个对象1ms
- 发现了一个 Angularjs ng-show ng-if 的错误
- 询问ng show/ng hide中的状态
- 使用ng-if/ng-show/ng-switch的Angular条件显示会简要地显示这两个元素
- Ng-show / ng-hide从$scope中删除ng-model
- Angular ng-show ng-hide animations
- 我无法设置ng-show/ng-hide动画
- 如何正确地隐藏/显示html通过ng-if/ng-show/ng-hide从app.run函数