Question

我们知道，编译通过一次，不重复。如果我有一个控制器，例如

，该怎么办？

<div ng-controller="SomeContr"></div>

，然后我创建了

<span>{{ text }}</span>

在控制器中，并使用appendChild（）方法放置此项，甚至是不动产

<div ng-controller="SomeContr">
<span>{{ text }}</span>
</div>

问题，如何使其工作表达{{text}}

Answer 1

首先要理解的重要事项之一：不要在控制器中操作DOM，将所有DOM操作人员放到指令中，让控制器关注模型（范围）。为了在指令中动态添加一些DOM元素，您可以使用$compile服务（请参阅用法部分），它将执行与将字符串作为模板一部分相同的工作：

<强> HTML

<div app-directive ng-init="text = 'Hello World'"></div>

<强>的JavaScript

angular.module('app',[]).
  directive('appDirective', function($compile) {
    return {
      link: function(scope, element) {
        var html = '<span>{{text}}</span>';
        element.append($compile(html)(scope));
      }
    }
  });

Plunker：http://plnkr.co/edit/dYbAMvqEScNITrwjkt13?p=preview

实现一个新的指令已编译模板

1 个答案: