我想知道如何处理 Angular 以在单击按钮时一次显示一个元素。 默认情况下隐藏项目，当不再有元素时隐藏按钮。
第一步
div one ---->一直显示
div 二---->隐藏
div 三---->隐藏
按钮 ---> 点击
第二步
div one ---->一直显示
div 二 ----> 可见
div 三---->隐藏
按钮 ---> 点击
第三步
div one ---->一直显示
div 二 ----> 可见
div 三----> 可见
按钮---> 点击-->隐藏
这是我的例子:http://plnkr.co/edit/PKx3pqrSwvyzhprBN8jI 但是在第一次点击时出现两个隐藏项目的例子
<body ng-controller="MainCtrl">
<div><input type="text" placeholder="first input"></div>
<div ng-show="state.show"><input type="text" placeholder="second input"></div>
<div ng-show="state.show"><input type="text" placeholder="third input"></div>
<button ng-click="state.show=!state.show">Add input</button>
</body>
预先感谢您所有对我有帮助的回答
最佳答案
您可以通过维护一个计数器来做到这一点:
$scope.show = 0;
$scope.incrementState = function () {
$scope.show++;
}
然后在 HTML 中:
<div ng-show="show >= 1"><input type="text" placeholder="second input"></div>
<div ng-show="show >= 2"><input type="text" placeholder="third input"></div>
如果您只需要两个输入，这可能最适合您的需要，但如果您希望输入的数量灵活，您可以使用 ng-repeat
<body ng-controller="MainCtrl as main">
<div ng-repeat="input in main.inputs track by $index">
<input type="text" placeholder="first input">
</div>
<button ng-click="main.inputs.push('another')">Add input</button>
在 Controller 中:this.inputs = ["first"]
关于angularjs - 如何用 Angular 一一显示元素，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/33426346/