Question

这是我的控制器：

(function(){
  'use strict';

  angular
    .module('app')
    .controller('HomeController', ['Factory',
                                  HomeController]);

    function HomeController(Factory){

      var result = Factory.query();

      this.model = result[0];

    }
})();

在视图中我通过这样做得到了值

div(ng-controller='HomeController as HomeCtrl')
  h3{{HomeCtrl.model}}

问题是我没有任何价值。我完全确定从工厂返回的值，因为我已经测试了Factory.query（），我得到了结果。实际上如果我按照以下方式执行并通过执行HomeCtrl.result [0]获取视图中的值，我得到结果。

(function(){
  'use strict';

  angular
    .module('app')
    .controller('HomeController', ['Factory',
                                  HomeController]);

    function HomeController(Factory){

      this.result = Factory.query();

    }
})();

Answer 1

您应该使用$ scope将数据传递给视图。这样，当您的范围变量发生变化时，Angular将绑定数据并自动更新视图（由于异步调用，您的模型变量可能在视图呈现时不可用）。尝试这样的事情：

控制器

$scope.model = result[0];

查看

h3{{model}}

Answer 2

嗯，工厂的查询方法肯定是一个异步方法，它会立即返回一个空数组，但只有在异步查询的结果可用时（例如，当它从AJAX请求获得响应时）才会填充它：

var query = function() {
    var result = [];
    $http.get('/somePath').success(function(data) {
        copyDataElementsTo(data, result); // 1 second later, the result is populated
    }
    return result; // returned immediately, empty
};

因此，由于您的控制器不会等待查询结果，因此它会将此时未定义的result[0]分配给其model变量。

你的第二种工作方式是有效的，因为在这种情况下，一旦收到对异步请求的响应，视图就会重新呈现，所以它会重新评估result[0]，其中包含从AJAX请求。

Answer 3

由于您希望在填充数组后获取数组的第一个元素，您可以在回调中执行此操作：

Factory.query(function(result) {
    this.model = result[0];
});

为什么无法获取存储在控制器变量中的值

3 个答案: