Angularjs$http.get（）。然后将其绑定到列表

我有一个如下列表：

<li ng-repeat="document in DisplayDocuments()" ng-class="IsFiltered(document.Filtered)">
    <span><input type="checkbox" name="docChecked" id="doc_{{document.Id}}" ng-model="document.Filtered" /></span>
    <span>{{document.Name}}</span>
</li>

当这个运行时，我没有得到任何结果。当我删除

then

方法时，我得到三个空行，使计数正常，但没有显示任何信息

我知道“其他任何事情”都是有效的，因为我之前用jQuery填充了列表，我做错了什么

以下是服务器的响应：

{Id:3f597acf-a026-45c5-8508-bc2383bc8c12, Name:ZZ_BL0164_Skisse BL0164_945111.pdf, Order:1,…}
{Id:46f51f1f-02eb-449a-9824-8633e8ae7f31, Name:ZB_BL0201_Firmaattest BL0201_945111.pdf, Order:1,…}
{Id:fddd1979-c917-4b32-9b83-b315f66984ed, Name:ZA_BL0228_Legitimasjonsskjema BL0228_945111.pdf,…}

---

尝试使用

success（）

$http.get('/Documents/DocumentsList/' + caseId).success(function (result) {
    $scope.Documents = result;
});

但是现在因为
文档
是一个数组而不是承诺，所以删除
（）


{{document.Name}

$http方法返回一个无法迭代的承诺，因此必须通过回调将结果附加到范围变量：

$scope.documents = [];
$http.get('/Documents/DocumentsList/' + caseId)
  .then(function(result) {
    $scope.documents = result.data;
});

现在，由于这只在获取结果后定义了
documents
变量，因此需要预先初始化作用域上的
documents
变量：
$scope.documents=[]
。否则，您的ng重复将窒息

这样，ng repeat将首先返回一个空列表，因为
documents
array起初是空的，但一旦收到结果，ng repeat将再次运行，因为成功回调中的“documents”已更改

此外，您可能希望将ng repeat表达式更改为：

<li ng-repeat="document in documents" ng-class="IsFiltered(document.Filtered)">



因为如果您的
DisplayDocuments（）
函数正在调用服务器，那么由于$digest循环，此调用将被多次执行。
实际上您在
$http.get
上获得
promise

尝试使用以下流程：

<li ng-repeat="document in documents" ng-class="IsFiltered(document.Filtered)">
    <span><input type="checkbox" name="docChecked" id="doc_{{document.Id}}" ng-model="document.Filtered" /></span>
    <span>{{document.Name}}</span>
</li>

从
$http
返回的承诺不能直接绑定（我不知道为什么）。
我使用的包装服务非常适合我：

.factory('DocumentsList', function($http, $q){
    var d = $q.defer();
    $http.get('/DocumentsList').success(function(data){
        d.resolve(data);
    });
    return d.promise;
});

并在控制器中绑定到它：

function Ctrl($scope, DocumentsList) {
    $scope.Documents = DocumentsList;
    ...
}

更新！：

在Angular 1.2中，删除了自动展开承诺。
参见
我通常使用.get（…）.success（函数（数据）{}）；也许您可以添加console.log（result）并查看它的输出？我还要确保你调用的url格式正确。什么是caseId？我也试过，只是觉得这个看起来更好，更容易理解，这就是为什么我想尝试一下。我见过有人同时使用这两种方法，但无法以这种方式工作。您正在将
Document
绑定到您的范围，但在
ng repeat
中使用
DisplayDocuments（）
从何而来？我在工厂做了类似的事情。但是，我没有使用
$scope.Documents
而是使用
var mypromise
在then/success部分设置了
$scope.Documents
。我有一个应该返回文档的服务，这就是为什么我想避免在then/success部分设置$scope.Documents，但看起来我必须这样做。所以我只能在不返回数组的情况下返回对作用域的承诺？Displaydocuments不会调用服务器，无论如何还是要感谢您的提醒。我的意思是，如果您编写
$scope.documents=$http.get（…）
，那么
文档将引用一个承诺（来自$q服务），因为$http服务返回的是一个承诺。是的，我理解，但我认为angular能够自动解决这个承诺？显然我错了。你可能把$http服务错当成了，它确实返回了一个（迭代的）承诺，但当结果返回时，承诺会自动得到解决。老实说，我不知道$resource，但它看起来和我要找的完全一样。谢谢我还是不太清楚怎么做，但是伙计，你结束了我的痛苦。谢谢大家!@Davion和任何想知道这段代码中发生了什么的人，$http返回一个http承诺，它封装了响应对象，而不是实际的数据。这就是为什么你不能直接“绑定”到它。在这里，$q服务用于创建一个新的承诺，该承诺将被解析为实际数据。利用这一承诺，控制器可以获取实际数据，而不仅仅是http响应。顺便说一句，$http success和error方法已被弃用，因此现在建议使用then。
$scope.documents = [];

$http.get('/Documents/DocumentsList/' + caseId).then(function(result) {
    result.data.forEach(function(val, i) { 
        $scope.documents.push(/* put data here*/);
    });
}, function(error) {
    alert(error.message);
});                       

.factory('DocumentsList', function($http, $q){
    var d = $q.defer();
    $http.get('/DocumentsList').success(function(data){
        d.resolve(data);
    });
    return d.promise;
});

function Ctrl($scope, DocumentsList) {
    $scope.Documents = DocumentsList;
    ...
}