AngularJS - 納克單擊 - 納克級 - 切換禁用/啓用

我有這樣的錶行：AngularJS - 納克單擊 - 納克級 - 切換禁用/啓用

<table> 
<tr ng-repeat="truckWheelbase in truckWheelbases | orderBy:sortFunction" ng-click="toggleRow($index)">        
    <td> 
     <!--Wheelbase-->      
     <label class="checkbox" for="{{truckWheelbase.Id}}"> 
     <input type="checkbox" ng-model="selection.Ids[truckWheelbase.Id]" id="{{truckWheelbase.Id}}"> 
      {{truckWheelbase.WheelBaseGrade}} - {{truckWheelbase.Inches}} inches 
     </label> 
    </td> 
    <!--Payload--> 
    <td> 
     <input id="{{truckWheelbase.Payload}}" type="number" ng-class="getClass({{truckWheelbase.Id}})"> 
    </td> 
</tr> 
      .......remaining rows ............ 
</table>

我試圖做到：

在頁面的開始加載每個錶行的所有控件都被禁用，但第1列中的複選框控件除外。

當用戶選中/取消選中相應行的複選框時，該行中的所有控件都被啓用/禁用。

我沒有很大的成功，但我相信納克級是必要的，toggleRow（$指數）控制器將類設置爲禁用=「禁用」或只是空白。

任何想法？

插圖：「selection.Ids [truckWheelbase.Id]」

enter image description here

bmleite

NG-禁用=確實禁用所有的頁面加載控件，但我該如何執行ng-class =「getClass（{{truckWheelbase.Id}}）」啓用複選框單擊？

來源

2013-02-27 Joe Grasso

鏈接到jsFiddle？ – Donut 2013-02-27 21:54:46

而不是'ng-class =「...」'，嘗試'ng-disabled =「selection.Ids [truckWheelbase.Id]」' – 2013-02-27 22:40:47

我不確定您的toggleRow()函數正在做什麼，但我認爲它正在更改selection.Ids對象。如果是這種情況，您只需使用相同的信息來啓用/禁用輸入。爲此，請使用ng-disabled指令：

<!--Payload--> 
<td> 
    <input id="{{truckWheelbase.Payload}}" type="number" ng-class="getClass({{truckWheelbase.Id}})" 
      ng-disabled="!selection.Ids[truckWheelbase.Id]"> 
</td>

來源

2013-02-27 22:41:35 bmleite

AngularJS - 納克單擊 - 納克級 - 切換禁用/啓用

回答

相關問題