为什么这个角度表达式在我的模板指令中不起作用

时间:2015-05-25 19:25:35

标签: angularjs templates

我有一个使用此模板的指令:

template: '<div id={{day}} ng-class="daystatus" ng-click="toggle()">{{day | date: "d"}}</div>'

变量日期包含一个执行时的日期,如下所示:

<div id="&quot;2015-09-21T22:00:00.000Z&quot;" ng-class="daystatus" ng-click="toggle()" class="ng-binding selectable" role="button" tabindex="0">22</div>

问题一:“为什么在第一个表达式中将双引号放在字符串中?

问题二:正如您所看到的,在这种情况下,一切都按预期工作,但如果我尝试在第一个表达式中应用以获得与第二个表达式相同的格式,例如:

template: '<div id={{day | date: "d"}} ng-class="daystatus" ng-click="toggle()">{{day | date: "d"}}</div>'

它根本不会按预期呈现,产生以下HTML代码:

<div id="{{day" |="" date:"d"}}="" ng-class="daystatus" ng-click="toggle()" class="ng-binding selectable" role="button" tabindex="0">22</div>

有关为什么表现如此的任何线索?

1 个答案:

答案 0 :(得分:1)

您必须转义属性中的引号:

{
    template: '<div id={{day | date: "d"}} ng-class="daystatus" ng-click="toggle()">{{day | date: "d"}}</div>'
}

要:

{
    template: '<div id="{{day | date: \'d\'}}" ng-class="daystatus" ng-click="toggle()">{{day | date: "d"}}</div>'
}