我有一个使用 MUI CSS 框架使用 Material 设计生成的复选框列表,下面的代码基本上循环遍历一个数组并显示 5 个复选框。
<i>
标签包含“check_box”或“check_box_outline_blank” - 如果它显示“check_box”,则此“复选框”显示为已勾选,如果它包含“check_box_outline_blank”,则该“复选框”将显示为未勾选。
使用ng-click我想利用函数toggleNetwork来基本上切换<i>
标签包含“check_box”或“check_box_outline_blank”
//HTML
<div class="detail permissions" ng-class="{unfolded: role.showDetails != 'permissions'}" border-watch>
<ul>
<li ng-repeat="page in rule.pages" ng-click="toggleNetwork(this); ruleForm.$setDirty()">
<span class="pull-left"><i class="check material-icons nomargin ">check_box</i></span>
<i class="icon icon-{{page.service}}"></i>
<span class="permission-description">{{page.name}}</span>
</li>
</ul>
</div>
//JavaScript
$scope.toggleNetwork = function(this) {
// change the `<i>` element to either 'check_box' OR 'check_box_outline_blank'
}
最佳答案
你也可以尝试
<i class="material-icons show-icon" ng-if="!clicked">check_box_outline_blank</i>
<i class="material-icons show-icon" ng-if="clicked">check_box</i>
<强> DEMO
关于javascript - 使用 ng-click 通过更改 <i> 元素来切换复选框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40849621/