$ scope.data未定义但$ scope.data存在于$ scope中

Question

我这里有我的javascript代码：

 define(['controllers/controllers', 'services/alerts'], function(module) {
  'use strict';
  return module.controller('alerts', [
    '$scope', '$http', 'alerts', function($scope, $http, alerts) {
    console.log('alerts controller initialized');
    $scope.settings = {};
    return $scope.submit = function() {
      $scope.busy = true;
      console.log('scope', $scope);
      return console.log('data', $scope.data);
    };
  }
]);

}）;

我尝试记录$scope.data的内容，我希望其中包含ng-model =＆gt;的值data.followers但始终显示未定义但当我尝试记录$scope的值内容时，$scope.data存在。如图所示：

我尝试初始化$scope.data，但在更改ng-model =＆gt;的值后，它将始终返回一个空数组data.followers。这是我初始化ng-model时的代码（以haml为单位）：

 %input{:type => "checkbox", "ng-checked" => "settings.#{$key}", "ng-model" => "data.#{$key}", "ng-true-value" => "true", "ng-false-value" => "false", "ng-click" => "submit()"}

有什么想法吗？

UPDATE：

已经解决了这个问题。我所做的就是初始化$ scope.data并在ng-checked中使用数据。＃{$ key}。这让我陷入困境。 Noob角度程序员在这里。

Answer 1

延迟加载Angular组件时，需要使用$scope.$apply()。当组件使用Require或其他方法延迟加载时，函数将注册到Angular的$digest循环之外的范围内。使用$scope.$apply()会使$digest知道您的绑定，并将它们带入应用实例。

您可能还需要使用module.register.controller代替module.controller

define(['controllers/controllers', 'services/alerts'], function(module) {
  'use strict';
  return module.register.controller('alerts', [
    '$scope', '$http', 'alerts', function($scope, $http, alerts) {
    console.log('alerts controller initialized');
    $scope.settings = {};
    return $scope.submit = function() {
      $scope.busy = true;
      console.log('scope', $scope);
      return console.log('data', $scope.data);
    };
    $scope.$apply();
  }
]);