我似乎永远无法让Form在Angular中正常工作。我总是添加一个<form name="myform">
,然后尝试使用$scope.myform
在模板或控制器中访问它,但它总是未定义的!我似乎无法弄清楚这些是如何工作的。
这是我的代码:
模板
<form name="o365form" novalidate>
<ul class="formList">
<li>
<label>Office 365 Admin Username</label>
<input type="text" ng-model="Master.Start.skAccount.username" required/>
</li>
<li>
<label>Office 365 Admin Password</label>
<input type="text" ng-model="Master.Start.skAccount.password" required/>
</li>
</ul>
</form>
然后我在控制器的函数中有这个代码,但o365form
未定义...
控制器
if ($scope.o365form.$invalid) {
return false;
} else {
return true;
}
答案 0 :(得分:0)
您需要使用ng-form
directive:
这就像
一样简单<ng-form name="o365form">
<ul class="formList">
<li>
<label>Office 365 Admin Username</label>
<input type="text" ng-model="Master.Start.skAccount.username" required/>
</li>
<li>
<label>Office 365 Admin Password</label>
<input type="text" ng-model="Master.Start.skAccount.password" required/>
</li>
</ul>
</ng-form>
答案 1 :(得分:0)
以表格
添加ng-submit指令<form name="o365form" ng-submit="submit(o365form)" novalidate>
<ul class="formList">
<li>
<label>Office 365 Admin Username</label>
<input type="text" ng-model="Master.Start.skAccount.username" required/>
</li>
<li>
<label>Office 365 Admin Password</label>
<input type="text" ng-model="Master.Start.skAccount.password" required/>
</li>
</ul>
</form>
控制器中的
$scope.submit = function(o365form){
if (o365form.$valid) {
return false;
} else {
return true;
}
}
$ watch
的示例<form name="o365form" form-valid novalidate>
<ul class="formList">
<li>
<label>Office 365 Admin Username</label>
<input type="text" ng-model="o365form.username" required/>
</li>
<li>
<label>Office 365 Admin Password</label>
<input type="text" ng-model="o365form.password" required/>
</li>
</ul>
<button type="submit">Submit</button>
</form>
指令
app.directive("formValid", function () {
return {
link: function ($scope, element, attrs){
$scope.$watch(attrs.name, function (isValid){
if (isValid.$valid) alert("valid");
else alert("not valid");
}, true);
}
}
});