Question

“我有以下问题：我想从异步休息调用中获取json，并在Angular库的一些现有指令中使用它（在我的例子中是angular-ui-tree和angular-charts）。

这是一个使用angular-ui-tree的简单示例，用于解释我的问题。服务：

var mod = angular.module("user.services");
mod.factory("userService", ["$http",  function ($http) {

    return {
        getUserMenu: function () {
        //call rest
            return $http.get('/user/menu').then(function (response) {
                    return response.data;
            });
        }
    };
}]);

控制器：

var mod = angular.module("admin.controllers");
$scope.menu = [];
userService.getUserMenu().then(function(menuResp){
     $scope.menu = menuResp;
};
$scope.showbody = true;
$scope.selectedItem = {}; 
$scope.options = {};
...

页面（它只是一个片段）：

<div ng-controller="MenuListCtrl">
<script type="text/ng-template" id="items_renderer.html">
   <div ui-tree-handle>... </div>
   <ol ui-tree-nodes="options" ng-model="item.items">
    <li ng-repeat="item in item.submenu" ui-tree-node ng-include="'items_renderer.html'"></li>
    </ol>
</script>
<div ui-tree="options">
<ol ui-tree-nodes ng-model="list" >
 <li ng-repeat="item in menu" ui-tree-node ng-include="'items_renderer.html'"></li>
</ol>
</div>

当我打开页面时树正确渲染但我在控制台中出错。在Angular-ui的情况下，错误是“无法读取未定义的属性'0'”。我认为这是因为当控制器加载菜单时没有设置var。

可能这种方式是错误的。我认为解决方案是在数据加载后渲染angular-ui-tree片段。像这样：

var mod = angular.module("tnp.admin.controllers");
userService.getUserMenu().then(function(menuResp){
//render tree template with menuResp data or append in my fragment the angular-ui-tree directive with menuResp data
};

我和其他库有这个问题。错误是不同的，但我认为基本问题是相同的。有人可以帮我吗？如何渲染我的片段这个菜单数据？感谢!!!

Answer 1

我不明白为什么需要在您的服务中声明menu。在调用服务填充它之前，应确保$scope.menu设置为控制器中的空数组。

异步数据提取和角度库

1 个答案: