小编Tim*_*rez的帖子

AngularJS指令不会更新范围变量更改

我试图编写一个小指令,用其他模板文件包装其内容.

这段代码:

<layout name="Default">My cool content</layout>
Run Code Online (Sandbox Code Playgroud)

应该有这个输出:

<div class="layoutDefault">My cool content</div>
Run Code Online (Sandbox Code Playgroud)

因为布局"默认"具有以下代码:

<div class="layoutDefault">{{content}}</div>
Run Code Online (Sandbox Code Playgroud)

这里是指令的代码:

app.directive('layout', function($http, $compile){
return {
    restrict: 'E',
    link: function(scope, element, attributes) {
        var layoutName = (angular.isDefined(attributes.name)) ? attributes.name : 'Default';
        $http.get(scope.constants.pathLayouts + layoutName + '.html')
            .success(function(layout){
                var regexp = /^([\s\S]*?){{content}}([\s\S]*)$/g;
                var result = regexp.exec(layout);

                var templateWithLayout = result[1] + element.html() + result[2];
                element.html($compile(templateWithLayout)(scope));
            });
    }
}
Run Code Online (Sandbox Code Playgroud)

});

我的问题:

当我在模板中使用范围变量时(在布局模板中或布局标签内),例如.{{whatever}}它刚开始工作.如果我更新whatever变量,则指令不再更新.整个链接功能只会触发一次.

我认为,AngularJS不知道,该指令使用范围变量,因此不会更新.但我不知道如何解决这个问题.

javascript angularjs angularjs-directive angularjs-scope

66
推荐指数
4
解决办法
14万
查看次数