Question

我正在创建一个带有角度JS和StamPlay的小吼声盒。因此，我创造了一些“测试呐喊”＆＃39;可以通过URL

加入

在我的Angular应用程序中，我创建了一个服务来获取数据：

＆＃13;

app.factory('shouts', ['$http', function ($http) {

    return $http.get('https://shoutbox.stamplayapp.com/api/cobject/v1/shouts').success(function (data) {
        return data.data;
    });

}]);

＆＃13;

在我的MainController中，我将数据附加到$ scope。

＆＃13;

app.controller('HomeController', [
    '$scope',
    'shouts',

    function ($scope, shouts) {
        $scope.shouts = shouts;
    }

]);

＆＃13;

但是当我通过数据[]进行ng-repeat时，我无法访问其中的对象。我不明白这个问题是什么。

＆＃13;

<div ng-repeat="shout in shouts">
  {{shout.title}}
</div>

＆＃13;

Answer 1

即使你做“返回data.data”，

喊叫是一个$ promise。所以你需要在承诺解决时分配$ scope.shouts。

app.factory('shouts', ['$http', function ($http) {

    return $http.get('https://shoutbox.stamplayapp.com/api/cobject/v1/shouts');

}]);

app.controller('HomeController', [
    '$scope',
    'shouts',

    function ($scope, shouts) {
       shouts.then(function(data) { $scope.shouts = data.data});
    }

]);

另一个选择是解决路由配置中的呼叫并将其注入控制器

$routeProvider
.when("/home", {
    templateUrl: "home.html",
    controller: "HomeController",
    resolve: {
        shout_data: shouts
    }


app.controller('HomeController', [
    '$scope',
    'shout_data',

    function ($scope, shout_data) {
       $scope.shouts = shout_data;
    }

]);

Answer 2

您是否忘记将控制器附加到HTML？

<div ng-controller="HomeController">
    <div ng-repeat="shout in shouts">
      {{shout.title}}
    </div>
</div>

有关ngController的更多信息：https://docs.angularjs.org/api/ng/directive/ngController

通过一个对象数组重复

2 个答案: