为什么在AngularJS中$ scope中的ng-init中设置的变量未定义?

时间:2013-09-04 07:45:37

标签: angularjs

我在我的视图中设置了一个变量ng-init,然后我尝试在我的控制器中访问该变量。但是,当我尝试访问它时,我收到了undefined

相关的代码:

我的观点:

<div ng-controller="MyCtrl">
  <div ng-init="pageTitle = 'kittens'">
  </div>
</div>

我的控制器:

var MyCtrl;

MyCtrl = function($scope) {
  return console.log($scope.pageTitle);
};

JSFiddle

我在这里缺少什么?

4 个答案:

答案 0 :(得分:36)

等到变量为init。

$scope.$watch('pageTitle', function () {
    console.log($scope.pageTitle); 
});

答案 1 :(得分:15)

您还可以利用JavaScript定义函数的方式,并使用ng-init的函数而不是$ watch(jsfiddle)。

<div ng-app>
    <div ng-controller="MyCtrl" ng-init="pageTitleEquals('kittens')">
        Page title is {{ pageTitle }}
    </div>
</div>

控制器:

var MyCtrl = function($scope) {   
    $scope.pageTitleEquals = function(title) {
        $scope.pageTitle = title;
    }
};

这个问题类似:How to set scope property with ng-init?

答案 2 :(得分:12)

在将pageTitle变量添加到$ scope对象之前创建控制器。

答案 3 :(得分:3)

由于你正在进行“单次初始化”,就像构造函数一样,我建议你在使用变量后取消绑定手表:

var pageTitleWatch = $scope.$watch('pageTitle', function () {
    console.log($scope.pageTitle);
    // Now just unbind it after doing your logic
    pageTitleWatch();
});