我有一个角度形式,其中问题在数组中指定。
HTML如下:
<form ng-controller="SupplierController" name="newSupplierForm">
<p>Enter details for the new Supplier. The new supplier will be added to category {{selectedCategory.description}}</p>
<p ng-repeat="field in formfields">
<label class="field" for="{{field.name}}" ng-hide="newSupplierForm.{{field.name}}.$dirty && (newSupplierForm.{{field.name}}.$error.required || newSupplierForm.{{field.name}}.$invalid)">{{field.caption}}</label>
<label class="error" for="{{field.name}}" ng-show="newSupplierForm.{{field.name}}.$dirty && (newSupplierForm.{{field.name}}.$error.required || newSupplierForm.{{field.name}}.$invalid)">{{field.caption}}</label>
<input type="{{field.type}}" name="{{field.name}}" ng-model="newSupplier[field.name]" ng-required="{{field.required}}">
</p>
<button ng-disabled="newSupplierForm.$invalid" ng-click="saveSupplier()">Save</button>
</form>
控制器是:
financeApp.controller('SupplierController', function($scope, $http) {
$scope.formfields = [
{caption:'Name :', name:'name', required:"true", type:"text"},
{caption:'Address :', name:'address1', required:"true", type:"text"},
{caption:' :', name:'address2', required:"true", type:"text"},
{caption:' :', name:'address3', required:"", type:"text"},
{caption:' :', name:'address4', required:"", type:"text"},
{caption:'Post Code :', name:'postcode', required:"", type:"text"},
{caption:'Email :', name:'email', required:"", type:"email"},
{caption:'Phone :', name:'phone', required:"", type:"text"}
];
$scope.newSupplier = {};
$scope.saveSupplier = function() {
$http.post('/finance/supplier', newSupplier).success(function(data) {
alert(data);
});
}
});
这一切似乎都能正常工作,除非永远不启用“保存”按钮,即使表单有效也是如此。到目前为止我所做的研究表明这应该有效,但事实并非如此。
示例:Disable a button if at least one input field is empty using ngDisabled
我做错了什么?
另外,有没有办法一般地改进这个代码?这是我第一次尝试Angular。
答案 0 :(得分:1)
尝试required
,没有大括号,因为这已经需要一个角度表达式。
在控制器内部,将{{1}}视为真或假,而不是字符串。
至于如何改进这个,你使用的方法是可以的,但是如果你的表单总是有相同的字段(它不是动态的),你应该为每个字段创建html元素,而不是声明它们在控制器内部。
控制器应该控制视图的行为,而不是要显示的字段(在非动态的视角中)。