当 ajax 调用更改其值时,AngularJS 中的 ng-repeat 列表不会更新

2023-11-23

我完全糊涂了。当 ajax 调用更改其值时,为什么我的 ng-repeat 不刷新?我在这里看到了很多问答,但没有一个谈到ajax调用。

HTML:

<div class="row" ng-controller="EntryCtrl">
    <div id="treeview" class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
        <ul>
            <li ng-repeat="root in rootEntry">{{root.Name}}</li>
        </ul>
    </div>
</div>

JS:

function EntryCtrl ($scope, $http) {
    $scope.rootEntry = [];
    $http.get('read/root').success(function(root) {
        $scope.rootEntry = root;
        console.log($scope.rootEntry);
    });
}

控制台确实记录了服务器返回的数组。但 html 中的列表从未更新。如果我用过$scope.$apply,有关错误$digest会发生。

控制台输出

[Object]
    0: Object
        Attributes: null
        Id: "534580464aac494e24000001"
        Name: "Registry"
        Path: ""
        __proto__: Object
        length: 1
    __proto__: Array[0]

所以它的结构是root服务器返回。会不会是数据类型的问题?因为它是Object而不是Array。我使用 Golang 作为服务器并使用json.Marshal()打包来自 MongoDB 的数据。

Update

function EntryCtrl ($scope, $http) {
    $scope.rootEntry = [];
    $http.get('read/root').success(function(root) {
        $scope.rootEntry = root;
        console.log($scope.rootEntry);
    });
    console.log($scope.rootEntry);
}

后者的输出是[]。很可能是因为 $http 的 async,所以会是这个原因吗?

Final

我知道为什么。我使用了一个名为jsTree,这将对节点进行一些装饰,因此我插入的节点将被覆盖。

谢谢你们。


我已经测试了您的代码,正如 tymeJV 所说,您的实现没有问题,我建议检查控制台窗口是否有一些可能的错误。

例子:

function EntryCtrl ($scope, $http) {
    $scope.rootEntry = [];
    $http.get('https://api.github.com/users/mralexgray/repos').success(function(root) {
        $scope.rootEntry = root;
        console.log($scope.rootEntry);
    });
}   

实例:http://plnkr.co/edit/Grlgfob6tjE63JizWdCD?p=preview

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

当 ajax 调用更改其值时,AngularJS 中的 ng-repeat 列表不会更新 的相关文章

随机推荐