Question

我有一个角度工厂和控制器：

angular.module('myApp', ['ui.router', 'ngResource'])
.factory('Widget', ['$http', function WidgetFactory($http) {
    return {
        all: function() {
            return $http({method: "GET", url: "/widgets"});
        }
    };
}])
.controller('StoreCtrl', ['$scope', 'Widget', function($scope, Widget) {
    $scope.widgets = Widget.all();
}]);

在我的前端我有

<div ng-controller="StoreCtrl">
    <li ng-repeat="widget in widgets">
        {{ widget.price }}
        {{ widget.name }}
    </li>
</div>

但我的{{ widget.price }}等等没有任何内容 我缺少什么？

Answer 1

你并没有完全按照框架的预期来解决你的承诺。查看$q docs以获取有关承诺的一些解释。我们还需要将视图模型值（范围）设置为the response object的正确返回值，由以下内容组成......

data - {string | Object} - 使用
转换的响应正文
转换功能。 status - {number} -
的HTTP状态代码
响应。 headers - {function（[headerName]）} - Header getter function。

config - {Object} - 用于生成
的配置对象
请求。 statusText - {string} - 响应的HTTP状态文本。

请注意以下内容......

Widget.all().then(function (response) {
    $scope.widgets = response.data;
});

此外，作为一些观察，不需要像使用WidgetFactory那样命名工厂函数，匿名函数也可以。您还可以利用$http shortcut method get以及此类内容......

.factory('Widget', ['$http', function($http) {
    return {
        all: function() {
            return $http.get('/widgets');
        }
    };
}]);

Answer 2

$ http返回一个承诺。当promise解析时，您需要将响应数据分配给$ scope.widgets。在控制器中，试试这个：

Widget.all().then(function (data) {
    $scope.widgets = data;
});

Answer 3

首先确保您有

的数组对象

  $scope.widgets;

控制器中

。你可以在你的控制器中打印这一行

console.log($scope.widgets);

查看数据是否可用。

角度范围不打印变量

3 个答案: