在表中如何使用角度 9 中的按钮启用和禁用 Bootstrap 复选框？

Question

我正在开发一个有角度的页面。我对角度不太熟悉。我花了几个小时来研究它，并浏览了有关此问题的最大数量的备用线程。但找不到我正在研究的解决方案。具体来说，我想在这里强调我正在使用引导复选框。我没有使用 ng-bootstrap。以下是我想解决的问题。当页面加载时，按钮应该被禁用，直到我单击复选框。当我单击表标题中的复选框时，它应该启用表中的所有复选框并启用按钮。当我取消选中标题中的复选框时，它应该禁用所有其他复选框并禁用按钮。以下是我为解决问题所做的详细信息。我的页面.html   <div id='bookstore'>            <table  class="table table-responsive table-striped">                <thead class="th-color">                    <tr>                        <th><input name="select_all_books" type="checkbox" ></th>                        <th class="theading">Book ID</th>                        <th class="theading">Book Name</th>                        <th class="theading">From Date</th>                        <th class="theading">To Date</th>                        <th class="theading">No of Days</th>                        <th class="theading">Apply Date</th>                        <th class="theading">Reason</th>                        <th class="theading">Book Status</th>                                           </tr>                </thead>                <tbody>                    <tr *ngFor="let data of bookstore | paginate: { itemsPerPage: pageSize, currentPage: p}">                        <td><input type="checkbox" id="rowcheckedbookstore"></td>                        <td> {{data.BookId }}</td>                        <td>{{ data.BookName }}</td>                        <td>{{ data.BookStart | date:'dd-MM-yyyy' }}</td>                        <td>{{ data.BookReturn  | date:'dd-MM-yyyy' }}</td>                        <td>{{ data.BookDays }}</td>                        <td>{{ data.ApplyDate}}</td>                        <td>{{ data.Reason }}</td>                        <td>{{ data.BookStatus}}</td>                                     </tr>                </tbody>                </table>                </div>我可以禁用页面加载上的按钮。但当我尝试使用复选框时，我无法实现。我想知道我怎样才能实现？

Answer 1

当页面加载时，按钮应该被禁用，直到我单击复选框。

<input disabled ng-disabled="name == '' || password == ''" type="submit" value="Log in" />

about 代码解决了我禁用 ng 的问题。