檢索transcluded指令中的所有ngModels

Question

我試圖檢索transcluded指令中的所有ngModels。這是正確的方法嗎？還是有更簡單的解決方案來查找子模型值？

有也選擇在那裏我可以使用查詢像這樣的（「輸入」，「文本區域」，「選擇」，...）

樣本：http://plnkr.co/edit/tjjBEa1I1fIISvGbRz7e?p=preview

Answer 1

我不知道這是否是正確的方法。你所有的模型都在你的$ scope中，爲什麼不直接從那裏獲取？

對於變化，你不應該使用jQuery像element.on（「變化」，...）的風格，而不是一個事件監聽器綁定到與$範圍模型。$腕錶（「模型」，...）那將是角度的方式。

Answer 2

你是否試圖禁用所有的輸入，並清除他們的值時勾選'禁用'複選框？

我建議加入ng-disabled指令對您的輸入並將其綁定到你的模型的屬性。

您可以輕鬆地將它們移動到物體上的模型，然後清除該屬性，當控件被禁用清除輸入的值。

更新您的plunkr的版本：http://plnkr.co/edit/xKRF3rfAB8EcSKEBEeKd?p=preview

這是基於你的榜樣更新的代碼：

app.js：

app.controller('MainCtrl', function($scope) { 
    // 1. Bind the 'Disable' checkbox's ng-model to this value. 
    $scope.disabled = false; 

    // 2. Move all your model data down one level onto the 'viewData' object. 
    // Now we can change all the input values just by changing the `$scope.viewData` object. 
    $scope.viewData = { 
     user: { 
      lastname: 'Doe', 
      firstname: 'John' 
     }, 
     checker: true, 
     opt: 'Item 2' 
    }; 

    // 3. Add a change callback on the 'Disable' checkbox to call this function. 
    // Replace the $scope.viewData to change the input values. 
    var originalData = null; 
    $scope.disabledChanged = function() { 
     if ($scope.disabled) { 
      // Clear the previous object. 
      originalData = $scope.viewData; 
      $scope.viewData = null; 
     } else { 
      // Revert back to the previous object. 
      $scope.viewData = originalData; 
     } 
    } 
}) 

的index.html：

<fieldset id="f"> 
    <legend> 
    <label><input type="checkbox" child-disable child-disable-root="f" ng-model="disabled" ng-change="disabledChanged()" /> Disable</label> 
    </legend> 
    <hr /> 
    <p><input type="checkbox" ng-model="viewData.checker" ng-disabled="disabled" /> Test</p> 
    <p><input type="text" ng-model="viewData.user.firstname" ng-disabled="disabled" /> 
    <input type="text" ng-model="viewData.user.lastname" ng-disabled="disabled" /></p> 
    <p><textarea ng-model="viewData.multi" ng-disabled="disabled"></textarea></p> 
    <div> 
     <select ng-model="viewData.opt" ng-disabled="disabled"> 
      <option>Item 1</option> 
      <option>Item 2</option> 
      <option>Item 3</option> 
     </select> 
    </div> 
    <div> 
     <button>Click</button> 
    </div> 
</fieldset>