在ng-repeat中检查AngularJS复选框
发布时间:2020-12-17 07:33:10 所属栏目:安全 来源:网络整理
导读:我知道解决方案不是很漂亮,但是我正在使用的模板需要它. 现在它可以正常工作,当产品在列表中时,它会向我显示“已添加”的span元素. section ng-repeat="product in products" label input type="checkbox" checklist-model="foobar.products" checklist-valu
我知道解决方案不是很漂亮,但是我正在使用的模板需要它.
现在它可以正常工作,当产品在列表中时,它会向我显示“已添加”的span元素. <section ng-repeat="product in products"> <label> <input type="checkbox" checklist-model="foobar.products" checklist-value="product.id"> {{ product.name }} </label> <div ng-repeat="current_item in my.profile.items"> <span ng-show="product.id==current_item.id">Added</span> </div> </section> 我想要的是,当复选框后面还出现“已添加”文本时,选中要选中的复选框. 我试过这样做: <ng-checked="{{my.profile.items.array.thing}}"> 但那不起作用.因为数组中的产品如: [{ id: 1,name:"Trinity",id: 2,name:"Van Gogh",id: 3,name:"Bonaqua",}] 而my.profile.items是一个包含更多信息的数组.因为它是我存储它的多对多关系. 有没有办法做到这一点?我不介意一个肮脏的解决方案:P 我试过这个: // NG-check function $scope.checkStoredValues = function(my) { // Loop trought my current stored items angular.forEach(my.profile.items,function(value,key) { // Loop trough the array angular.forEach(value,key) { console.error(key); // If key == 'id' if(key == 'id'){ // Push the value to the Array of the checkboxes,// so it's checked // # Docs: http://vitalets.github.io/checklist-model/ console.info(value); // Return's: integer foobar.products.push(value); // Needs more then an integer I guess.. } }); }); }; 返回:TypeError:无法读取undefined的属性’push’
将此功能添加到您的控制器:
$scope.isChecked = function(product) { var items = $scope.my.profile.items; for (var i=0; i < items.length; i++) { if (product.id == items[i].id) return true; } return false; }; 并为您的HTML使用 <section ng-repeat="product in products"> <label> <input type="checkbox" ng-checked="isChecked(product)"> {{ product.name }} </label> <div ng-repeat="current_item in my.profile.items"> <span ng-show="product.id==current_item.id">Added</span> </div> </section> (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |
相关内容
- jax-ws之webservice security(安全)教程第一天
- scala – 如何在单独的线程中运行代码?
- Bootstrap三种表单布局的使用方法
- date – unix – 获取工作日数
- angularjs – Angular UI-Router如何创建一个“布局”状态?
- angularjs – 如何观看集合中的每个对象?
- regex – 如何使用shell脚本查找Linux Distribution名称?
- scala – 在Spark中重新组合/连接DataFrame行
- 为什么webservice放到iis中,有时候没有访问数据库的权限呢
- 使用Vim在文本换行中自动继续使用Haskell注释中的前导破折号