2014-08-29 66 views
0

我有一個指令將li項添加到列表中。每個li都有一個div,包括模板。我追加HTML後編譯它,但ngInclude不起作用。它不包含指定的模板。用ngInclude附加html後編譯指令

scope.attrs.itemTpl = 'dimension-item-tpl.html'; 

elemnt.find('ul').append(generatedList); 
$compile(generatedList)(scope); 

試過兩個例子,HTML追加後:

<li class="col-xlg-2 col-lg-3 col-md-4 col-sm-6" data-item="creative_filename"> 
    <div ng-include="dimension-item-tpl.html"></div> 
</li> 
<li class="col-xlg-2 col-lg-3 col-md-4 col-sm-6" data-item="size"> 
    <div ng-include="dimension-item-tpl.html"></div> 
</li> 

與第二:

<li class="col-xlg-2 col-lg-3 col-md-4 col-sm-6" data-item="creative_filename"> 
    <div ng-include="attrs.itemTpl"></div> 
</li> 
<li class="col-xlg-2 col-lg-3 col-md-4 col-sm-6" data-item="size"> 
    <div ng-include="attrs.itemTpl"></div> 
</li> 

我在做什麼錯?

例子: http://jsfiddle.net/mato75/4zhLtjbw/

+0

你能告訴你的完整指令定義是什麼? – 2014-08-29 11:47:39

回答

0

在第一個例子

你缺少單引號。

ngInclude =評估爲URL的角度表達式。如果源爲 字符串常量,請確保將其用單引號括起來。 src =「'myPartialTemplate.html'」。

試試這個。

<li class="col-xlg-2 col-lg-3 col-md-4 col-sm-6" data-item="creative_filename"> 
    <div ng-include="'dimension-item-tpl.html'"></div> 
</li> 
<li class="col-xlg-2 col-lg-3 col-md-4 col-sm-6" data-item="size"> 
    <div ng-include="'dimension-item-tpl.html'"></div> 
</li> 

請注意單引號。

參考:https://docs.angularjs.org/api/ng/directive/ngInclude

+0

不,它不起作用 – puppeteer701 2014-08-29 11:45:08

+0

我想創建一個指令,它不需要ngRepeat,因爲指令上有一些額外的功能,這對ngRrepeat來說並不合適。 – puppeteer701 2014-08-29 11:56:20

+0

編輯您的文章並顯示您的指令定義的簡化版本 – 2014-08-29 11:58:24