當同級ng-include中的表單為$ invalid時，如何禁用ng-include中的按鈕？
[英]How do I disable a button in an ng-include when a form in a sibling ng-include is $invalid?
問題描述
想法是當表單“ myForm”無效時，禁用“提交我”按鈕。 我嘗試搜索，但所有示例均在表格內。 有人可以就如何做到這一點提出一些想法嗎？
注意：我要禁用的按鈕在表單外部，表單內的按鈕將被禁用。
編輯附加：使用ng-include添加表單，並使用單獨的ng-include添加按鈕。 抱歉，未添加此詳細信息，也許這是在我的情況下它不起作用的原因。
Plunkr： http ://plnkr.co/edit/7BY2kwciERqQLNGfcDtz <---現在可以使用。
Form.html
<form name="myForm">
<input name="myText" type="text" ng-model="mytext" required />
<button ng-disabled="myForm.$invalid">Save</button>
</form>
Button.html
<button ng-disabled="myForm.$invalid">Submit Me</button>
HtmlBody：
<body>
<div class="slide-animate" ng-include="'form.html'"></div>
<div class="slide-animate" ng-include="'button.html'"></div>
</body>
3 個解決方案
解決方案1
3 已采納 2014-03-26 05:22:52
基本上，我所做的就是使用ng-form創建parentForm，這樣我就可以訪問ng-include產生的子范圍。 有關更多信息，請參見plunkr。
我添加了這個punkr：
解決方案2
2 2014-03-26 01:37:17
您可以在控制器中觀察給定表單的有效性，並基於該表單更新作用域值：
$scope.$watch('myForm.$valid', function(newVal) {
$scope.myFormValid = newVal;
});
然后在您的按鈕上：
<button ng-disabled="!myFormValid">Submit Me</button>
解決方案3
1 2014-03-26 02:28:34
您可以通過將提交按鈕置於表單之外來破壞表單邏輯。
但是，我在jsfiddle中復制/粘貼了您的html代碼，並且工作正常，沒有任何更改。 字段為空時，提交按鈕被禁用。
這是小提琴： http : //jsfiddle.net/LAeeF/
我剛剛添加了一個基本控制器：
function myCtrl($scope) {
$scope.submit = function () {
alert('Submit button enabled');
}
}
在AngularJS 1.2中，如何為ng-include指定控制器？
[英]In AngularJS 1.2, how do I specify the controller for an ng-include?
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.