ng repeat和控制器之间的AngularJS通信

我刚刚开始使用AngularJS，作为一个项目，我决定构建一个用于管理书签的简单应用程序。我希望能够维护书签列表和添加/删除项目。我将Django与Django REST框架和Angular一起使用

到目前为止，我已经编写了一个从数据库获取书签的服务，我可以从我的控制器将它们打印到控制台，但是ng repeat似乎没有看到它们

以下是我的服务代码：

.factory('BookmarkService', ["$http", function ($http) {
    var api_url = "/api/bookmarks/";
    return {
        list: function () {
            return $http.get(api_url).then(function (response) {
                return response.data
             })
        }
    }
}]);

对于控制器：

.controller("ListController", 
 ["$scope", "BookmarkService", function ($scope, BookmarkService) {
    $scope.bookmarks = BookmarkService.list();
    console.log($scope.bookmarks);
}]);

下面是HTML：

<div ng-controller="ListController as listCtrl">
    <md-card>
        <md-card-content>
            <h2>Bookmarks</h2>
            <md-list>
                <md-list-item ng-repeat="bookmark in listCtrl.bookmarks">
                    <md-item-content>
                        <div class="md-tile-content">
                            <p>{[{ bookmark.name }]} - {[{ bookmark.url }]}</p> // used interpolateProvider to allow "{[{" instead of "{{"
                        </div>
                        <md-divider ng-if="!$last"></md-divider>
                    </md-item-content>
                </md-list-item>
            </md-list>
        </md-card-content>
     </md-card>
  </div>

书签
{[{bookmark.name}]}-{[{bookmark.url}]}
//使用InterpologeProvider允许“{[{”而不是“{{”

当我从控制器打印到控制台时，我可以看到承诺对象，但ng repeat没有重复：

如果有人能帮我找到我的错误并理解它为什么会发生，我真的很感激。我仍然不能完全理解这些部分是如何组合在一起的

---

感谢您的时间！

这很简单。Ng repeat不符合承诺。因此，您可以使用两种方法：

BookmarkService.list（）.then（函数（response）{ $scope.bookmarks=responce.data； }))

另一种方法是创建自己的repiter ^）

---

我发现有两个问题与正在讨论的代码有关

首先，使用控制器作为语法（

ng controller=“ListController as listCtrl”

）需要将属性绑定到控制器实例，而不是使用控制器名称寻址的范围。在您的情况下

.controller("ListController", 
  ["BookmarkService", function (BookmarkService) {
    this.bookmarks = BookmarkService.list();
    console.log(this.bookmarks);
  }]);

第二个问题是，您正在为

$scope.bookmarks

属性分配一个承诺。中继器希望迭代一个对象数组。您确实希望将承诺解析的值分配给

$scope.bookmarks

而不是这个

$scope.bookmarks = BookmarkService.list();

这样做

BookmarkService.list().then(function(result){
  this.bookmarks = result;
});

控制器的最终版本应该如下所示

.controller("ListController", 
  ["BookmarkService", function (BookmarkService) {
    this.bookmarks = BookmarkService.list();
    console.log(this.bookmarks);
  }]);

---

谢谢！这个答案解决了这个问题。我以前确实试过。但是，还有一个问题。当我使用“控制器作为”时，书签不会加载语法，即

listCtrl.bookmarks

。它们只是没有它。你知道为什么会发生这种情况吗？哦，我以前没有注意到。当使用controller作为语法时，你需要将属性附加到controller实例，而不是

$scope

。在这种情况下，它看起来像

.controller（“ListController”）[“BookmarkService”，函数（BookmarkService）{this.bookmarks=BookmarkService.list（）；console.log（this.bookmarks）；}]）；

注意

这个

而不是

$scope

我明白了！谢谢你的解释。不客气。我将控制器作为答案的一部分合并了。编码愉快