结合AJAX的数据NG-包括递归调用加载模板递归、加载、模板、数据

由网友(13.飘落的悲伤)分享简介:很抱歉,如果标题是相当神秘,我想复制这个例子: http://plnkr.co/edit/NBDgqKOy2qVMQeykQqTY?p=$p$pview ,它工作正常,但如果我通过ajax加载数据,这是行不通的。原来的控制器是:Sorry if the title is quite cryptic, I'm tryi...

很抱歉,如果标题是相当神秘,我想复制这个例子: http://plnkr.co/edit/NBDgqKOy2qVMQeykQqTY?p=$p$pview ,它工作正常,但如果我通过ajax加载数据,这是行不通的。原来的控制器是:

Sorry if the title is quite cryptic, I'm trying to replicate this example: http://plnkr.co/edit/NBDgqKOy2qVMQeykQqTY?p=preview and it works fine, but if I load data via ajax it doesn't work. The original controller is:

app.controller('MainCtrl', function($scope) {
    $scope.links = [
        {
            text: 'Menu Item 1',
            url: '#',
        },{
            text: 'Menu Item 2',
            url: '#',
            submenu: [
                {
                    text: 'Sub-menu Item 3',
                    url: '#',
                },{
                    text: 'Sub-menu Item 4',
                    url: '#',
                    submenu: [
                        {
                            text: 'Sub-sub-menu Item 5',
                            url: '#',
                        },{
                            text: 'Sub-sub-menu Item 6',
                            url: '#',
                        }
                    ]
                }
            ]
        },{
            text: 'Menu Item 3',
            url: '#',
        }
    ];
});

而我的是:

app.controller('SiteTreeCtrl', function ($scope, $http) {
    $http.post('/ajaxsite/tree', { section: "website" }).success(function (data) {
        $scope.folders = data.links;
    });    
});

问题是,HTML模板被加载的前的数据,并在数据准备好已经应用的结合。

the problem is that the html template is loaded before the data and when data is ready the binding is already applied.

工作例子(没有AJAX): http://plnkr.co/edit/NBDgqKOy2qVMQeykQqTY?p=$p$pview

不工作的例子(阿贾克斯): http://plnkr.co/edit/lF5VkRT67IybRQm5yTuB?p=$p$pview

什么是最好的方式来呢?

What is the best way to to that?

推荐答案

我不完全相信我的修正,但是当我删除 NG-的init =子菜单=链接;和 NG-模型,然后它的作品。

I am not exactly sure about my fix, but when I remove ng-init="submenu = links;" and replace with ng-model, then it works.

请看看演示。也许是因为 NG-包括创建其自己的范围,并以某种方式在 NG-INIT 不能抓住从范围值。

Please take a look at the demo. Maybe because ng-include creates its own scope and somehow the ng-init can not grab the value from the scope.

下面是我的修正:

<div ng-include="'partialMenu.html'" ng-model="submenu"></div>

$scope.submenu = $scope.links;

演示上plunker

阅读全文

相关推荐

最新文章