Question

我是AngularJs的新手，我在下面的代码中遇到了麻烦。

return {
        require: ['^myElement'],
        restrict: 'EA',
        replace: true,
        scope: true,
        link: function (scope, element, attrs, ctrls) {
            scope.xa = 'This is xa'
                    scope.$on('form:submit', function() {

                        scope.xb = 'This is xb'
                        var data = $compile( '<p>{{xa}} {{xb}}</p>' )( scope );
                        console.log(data.html()); //result is '{{xa}} {{xb}}', the expressions were not applied
                    });
                }
}

我从日志中获得的输出是'{{xa}} {{xb}}'，它应该是

'This is xa This is xb'

以下是plunker source code

Answer 1

很可能angularjs没有时间运行$ digest循环并且它没有解释变量，因为如果你将结果附加到html元素它可以工作：

http://plnkr.co/edit/N7TfEC1R1qNcPxY6eXNG?p=preview

scope.$on('form:submit', function() {
  scope.xb = 'This is xb'
  var data = $compile( '<p>{{xa}} {{xb}}</p>' )( scope );
  element.append(data);
});

Answer 2

我有一个模态对话框，用于显示将从模板缓存中编译的消息。在我的原始示例中，它只是从模板返回原始字符串，无论我做什么。解决方法是我需要将编译代码放入指令的<RCC> <qresource prefix="/"> <file>main.qml</file> <file>jsTest.js</file> <file>jQuery.js</file> <file>aws-sdk-2.0.30.js</file> </qresource> </RCC>部分，而不是controller部分，然后我将编译后的字符串返回到一个变量，如$ scope.data，我将使用它link

link

$ compile不在指令的link函数上应用模板字符串的表达式

2 个答案: