Question

我有这张桌子：

我的问题是，如果我选中所选行的复选框，它会启用/禁用＆＃34; Montant＆＃34;输入，这是我的尝试，但它永远不会奏效我把所有行都激活了!!

    <table>
                            <thead>
                                <tr>

                                    <th >
                                      <input type="checkbox" />
                                    </th>
                                    <th>Montant</th>
                                </tr>
                            </thead>
                            <tbody ng-model="finalOperationsList">
                                <tr ng-repeat="item in finalOperationsList track by $index ">
                                    <td class="TableHeaderalignment"><input type="checkbox" 
                                        ng-model="finalOperationsList[$index].checked" ng-change="changeMontantLBL($index)"/></td>
                                    <td class="TableHeaderalignment">
                                       <input type="text" class="form-control" value="{{item.montant}}" ng-disabled="montantBL" />
                                    </td>

                                </tr>
                            </tbody>
                        </table>

这是Controller中的功能：

 $scope.changeMontantLBL =function($index){

                      if(true){
                          $scope.montantBL = false;
                      }
                      else{
                          $scope.montantBL = true; 
                      }
                  }

那么请问我如何更正我的代码以进行输入＆＃34; Montant＆＃34;启用/禁用，具体取决于所选行复选框的选择谢谢你的帮助

Answer 1

您可以直接使用＆＃34; finalOperationsList[$index].checked＆＃34;的值在输入文本框的ng-disabled中，完全删除ng-change和scope.montantBL。

<tr ng-repeat="item in finalOperationsList track by $index ">
    <td class="TableHeaderalignment"><input type="checkbox" 
        ng-model="finalOperationsList[$index].checked"/></td>
    <td class="TableHeaderalignment">
       <input type="text" class="form-control" value="{{item.montant}}" ng-disabled="finalOperationsList[$index].checked" />
    </td>
</tr>

还值得注意的是，您可能误用了value="{{item.montant}}"，而应使用ng-model="item.montant"。您还可以将该行的代码简化为：

<tr ng-repeat="item in finalOperationsList track by $index ">
    <td class="TableHeaderalignment">
        <input type="checkbox" ng-model="item.checked"/></td>
    <td class="TableHeaderalignment">
        <input type="text" class="form-control" ng-model="item.montant" ng-disabled="item.checked"/>
    </td>
</tr>

Answer 2

您可以在ng-change方法中使用绑定的ng-model（answers [item.questID]）值本身来检测它是否已被检查过。

实施例： -

<input type="checkbox" ng-model="answers[item.questID]" ng-change="stateChanged(item.questID)" /> <!-- Pass the specific id -->

和

$scope.stateChanged = function (qId) {
 if($scope.answers[qId]){ //If it is checked
    alert('enable or disable input');
 }

}

如何根据所选复选框的选择启用/禁用输入文本

2 个答案: