[英]AngularJS: Initialize nested scope variables in controller
我喜欢保持模型名称的名称空间清晰和描述性,所以我使用这样的嵌套模型变量(月份和年份嵌套在服务中):
<form data-ng-submit="submit()">
<select data-ng-model="service.month" data-ng-options="m for m in months"/>
<input data-ng-model="service.year"/> {{ service.year }}
<input type="submit"/>
</form>
在我的控制器中,我想将$scope.service.month
和$scope.service.year
为初始值,但是我得到一个javascript错误Cannot set property 'year' of undefined
,所以我猜DOM没有'已经解析并且还没有创建所有$scope
变量。 在Angular解析DOM并且所有模型都已创建之前,我怎么能等待一些代码等待运行?
这是我的控制器:
mod.controller('AddServiceCtrl', [
'$scope',
'$rootScope',
function($scope, $rootScope) {
var date = new Date();
$scope.months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
$scope.service.year = 2014;
$scope.submit = function(){
};
}])
$scope.service= {month:'Mar',year:2014};
AngularJS仍然是JavaScript。
不幸的是,AngularJS团队选择命名实际上是演示者(或视图模型), controller
。 听起来可能不那么重要,但从概念上讲,这是为了理解controllers
作用。
问题是$scope.service
对象是undefined
,因此无法在控制器内部而不是视图上定义year
属性。 要使其工作,您必须在范围上设置service
对象,如下所示:
$scope.service = {};
然后,您可以在控制器或视图中为模型定义默认值:
控制器选项
$scope.service = {};
$scope.service.year = 2014;
要么
$scope.service = {
year: 2014,
month: $scope.months[3] // to default to 'Apr'
};
查看选项
<form data-ng-submit="submit()"
data-ng-init="service.year=2014; service.month=months[3]">
...
</form>
无论哪种方式,您必须在范围上创建service
对象,以便在其上定义属性。 使用对象文字符号( {}
)来创建它。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.