AngularJS指令 - 模板正在完全编译

时间:2014-08-28 09:26:33

标签: angularjs angularjs-directive angularjs-scope

我的指令中绑定类有问题,看起来它们没有被正确编译。 请注意,我无法使用裸骨应用程序重现这一点,但下面是对正在发生的事情的简短描述。

JFFiddle - with attributes
JSFiddle - without attributes

使用属性演示正常,但在我的真实应用中没有属性,遗憾的是我无法重现问题 。它实际上工作正常当我的应用程序非常小时,它是否与渲染速度有关? (即编译器能够编译它只是因为它足够快?)

我将尽力描述正在发生的事情而不创建特定属性,应该如下所示:

指令:
<div txt-directive>

模板:
<div class="class-{{bg}} class-{{color}}">{{ txt }}</div>

结果应该是:
<div class="class-bg class-color">Lorem ipsum dolor sit amet.</div>

相反,我得到了一半未完成的版本:
<div class="class-{{bg}} class-{{color}}">Lorem ipsum dolor sit amet.</div><br />

另外,我注意到当我使用ng-class时,结果是:
<div ng-class="class-{{bg}} class-{{color}}" class="ng-binding">Lorem ipsum dolor sit amet.</div>

看起来AngularJS编译器根本没有触及ng-class。我认为这与指令编译功能有关,但我太厚了,无法解决这个问题。

如上所述,内容编译正常,但类保留为表达式。 任何建议都非常赞赏。

1 个答案:

答案 0 :(得分:0)

使用ng-class代替课程,我认为应该有帮助