[英]How to prevent Jade Template parsing HTML attribute
我将Jade Template与Angular JS结合使用,并在angular的控制器中定义了这样的转发器处理简单数组:$ scope.ids = ['demo1','demo2']
.controls(ng-repeat="controlId in ids")
<div id="{{$index}}">{{$index}}</div>
无论我做什么,Jade都会尝试解析传递给SELECT标记的所有内容,因此它总是从标记的属性中删除$ index变量。 作为HTML的结果,我总是看到以下内容:
<div id="">0</div> // ID attribute is always empty because Jade replaces it
<div id="">1</div> // at the same time HTML of the tag was rendered correctly
问题 :如何防止Jade解析此HTML属性并按结果HTML形式打印字符串?
PS我尝试了以下语法,它不起作用...建议?
id="|{{$index}}" // id is empty
id!="{{$index}}" // id is empty
id="!{{$index}}" // syntax error
id="!{{controlId}}" // syntax error
{:id => {{$index}}} // does not add ID at all
PPS只是为了解释为什么我用HTML弄乱了Jade-我试图使用“仅jade”语法,但它也不起作用:
.controls(ng-repeat="controlId in ids")
.demo(id="{{$index}}") {{$index}}
尝试防止这样的解析:
!{{$index}} <-- Escaped
参考这篇文章: 如何使Jade停止HTML编码元素属性,并产生文字字符串值?
对于这个问题: https : //github.com/visionmedia/jade/issues/198
并说是否可行!
最近,我发现此讨论由Sangram开始:
ng-repeat的{{$ index}},在angular指令的链接器函数之后计算得出。 $编译吗?
我意识到Sangram在这方面是对的-这不是Jade的问题-这是angular渲染模板的方式。
有一个解决方案-在$ evalAsync内部调用链接函数-可能是一个不错的选择,但就我而言,我需要立即设置控件的ID,因此我想到了这种解决方案-如果我无法设置ID-我可以生成它:
app.directive('tags', ['$rootScope', function($rootScope) {
var controlIndex = 0;
var linker = function(scope, element, attrs) {
// *** Control ID *** //
element[0].id = attrs.id || 'control' + (++controlIndex);
...
}
return {
restrict: 'EA',
templateUrl: 'tags/template.html',
link: linker
}
}]);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.