我有一个带有按钮的 ng-repeat,如下所示:
<div data-ng-repeat="department in departments_array">
<div class="row">
<div class="col-md-6 dslc-button-wrapper">
<button class="btn btn-default btn-block">Show on Map {{ 1 | checkmark }}</button>
</div>
</div>
</div>
我找到了这个过滤器,我想用它在单击所选元素时显示一个复选框,并同时删除其他 ng-repeat 按钮中的所有其他复选标记:
angular.module('Filters', []).filter('checkmark', function() {
return function(input) {
return input ? '\u2713' : '';
};
});
我已经尝试了尽可能多的方法,但最终只能一次添加或删除一个元素上的复选标记。
任何帮助将不胜感激
谢谢
最佳答案
就我个人而言,我不会使用过滤器来执行此操作。在您看来,这不是管理状态的正确方法。 Controller 上的变量是典型且可读的解决方案。下面的解决方案 Plunker :
controller.js
myApp.controller('myController', function() {
var self = this;
self.departments_array = ['dept A', 'dept B', 'dept C'];
self.selected_dept = undefined;
});
index.html
<body ng-app="my-app">
<div ng-controller="myController as mc">
<div data-ng-repeat="department in mc.departments_array">
<div class="row">
<div class="col-md-6 dslc-button-wrapper">
<button ng-click="mc.selected=department" class="btn btn-default btn-block">
Show on Map <span ng-show="mc.selected===department">✓</span></button>
</div>
</div>
</div>
</div>
</body>
关于javascript - 单击时添加复选标记,删除所有其他标记,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36275252/