Angular Js 里面table, checkbox制作可多选，单选的表格

最新推荐文章于 2024-08-01 16:27:33 发布

qq_34241677

最新推荐文章于 2024-08-01 16:27:33 发布

阅读量4k

点赞数

分类专栏： angular-js 文章标签： angularjs checkbox

本文链接：https://blog.csdn.net/qq_34241677/article/details/78674919

版权

本文介绍了如何在AngularJS中利用table和checkbox实现可展开的子表，支持多选和单选功能。通过绑定ng-model到布尔值属性来控制复选框的状态，并展示了一个包含html和js代码的示例。

摘要由CSDN通过智能技术生成

Angular Js 里面table, checkbox制作可多选，单选的表格

查看别人的方法再加拓展，忘记了原博客地址；
主要实现主表格里面可以展开子表，子表的信息可以多选也可以单选，并绑定数据，算是三级选中吧？；
复选框只有两个值：true或者false，因此在AngularJS中，一般都是将复选框的ng-model绑定为一个布尔值属性，通过这两个布尔值来决定其勾选状态，以及通过其勾选状态来设置被绑定的属性值为true或false。我们来看以下示例：

图片预览：

这里写图片描述

html:

<div>
      <input  type="checkbox" ng-model="select_allList" ng-change="selectAll()"> 全部选中<br><br>
          <table class="table table-hover table-responsive workSheet-form">
                            <thead>
                            <tr>
                                <th>选择</th>
                                <th>大单位</th>
                                <th>小单位</th>
                            </tr>
                            </thead>
                            <tbody ng-repeat="item in customerList">
                            <tr>
                                <td>
                                    <label