如何在运行控制器代码后调用链接指令功能

Fut*_*oad 6 angularjs angularjs-directive

我试图在控制器解析http调用之后在链接函数中呈现代码,但在此之前调用链接函数.如何$scope.menuHtml在设置后调用链接?

HTML:

  <div id="testD" nav-menu-output="parseMenuJsonAndOutPutMenu()"></div>
Run Code Online (Sandbox Code Playgroud)

指示:

return {
    restrict: 'A',
    controller: ['$scope', '$q','$http', function ($scope, $q,$http) {
        $http.get('ajax/menu' ).then(function (data) {
            $scope.menuHtml = generateHtmlMenu(data);
        });
    }],
    link: function(scope, element, attr) {
        var templateString = scope.menuHtml;
        var compiledTemplate = $compile(templateString)(scope);
        compiledTemplate.appendTo("#testD");
    }

}
Run Code Online (Sandbox Code Playgroud)

bjt*_*tus 7

我建议使用scope.$watch()并重新运行已编译的模板代码.这样,您可以根据需要向菜单端点发出尽可能多的请求,并重新编译模板.

以下是有关手表的更多信息:http: //docs.angularjs.org/api/ng/type/$rootScope.Scope#$watch

这是一个应该正常工作的更新版本:

return {
    restrict: 'A',
    controller: ['$scope', '$q','$http', function ($scope, $q,$http) {
        $http.get('ajax/menu' ).then(function (data) {
            $scope.menuHtml = generateHtmlMenu(data);
        });
    }],
    link: function(scope, element, attr) {
        scope.$watch('menuHtml', function() {
            var templateString = scope.menuHtml;
            var compiledTemplate = $compile(templateString)(scope);
            compiledTemplate.appendTo("#testD");
        });
    }

}
Run Code Online (Sandbox Code Playgroud)