刚刚得到一个代码并看到代码正在运行,但在ng-model
作者使用user.name或user.email等但这些属性从未在控制器中声明.........那么如何它有效吗?
我们如何以这种方式将用户信息传递给控制器功能ng-click="update(user)"
?
<div ng-controller="ExampleController">
<form novalidate class="simple-form">
Name: <input type="text" ng-model="user.name" /><br />
E-mail: <input type="email" ng-model="user.email" /><br />
Gender: <input type="radio" ng-model="user.gender" value="male" />male
<input type="radio" ng-model="user.gender" value="female" />female<br />
<input type="button" ng-click="reset()" value="Reset" />
<input type="submit" ng-click="update(user)" value="Save" />
</form>
<pre>user = {{user | json}}</pre>
<pre>master = {{master | json}}</pre>
</div>
<script>
angular.module('formExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.master = {};
$scope.update = function(user) {
$scope.master = angular.copy(user);
};
$scope.reset = function() {
$scope.user = angular.copy($scope.master);
};
$scope.reset();
}]);
</script>
答案 0 :(得分:2)
HTML中的ng-model="user.gender"
代码指的是控制器中的$scope.user.gender
。
由于已经定义了$scope.user
,因此angular会自动设置该对象上的gender
属性。 user.email
和user.name
属性也是如此。
当您致电ng-click="update(user)"
时,update(user)
与update($scope.user)
相同。
This section of the angular tutorial更好地解释了$scope
变量如何工作以及如何在模板中访问它,我建议您阅读它,但这是一个快速的例子:
Angular中范围的概念至关重要。范围可以看作是允许模板,模型和控制器一起工作的粘合剂。 Angular使用范围以及模板,数据模型和控制器中包含的信息来保持模型和视图分离,但是同步。对模型所做的任何更改都会反映在视图中;视图中发生的任何更改都会反映在模型中。