AngularJS控制通過指令呈現的精確DOM

我想「定向」搜索結果。每個結果將在ul HTML標記內呈現爲li。AngularJS控制通過指令呈現的精確DOM

這意味着我想避免默認的AngularJS渲染到包含指令元素的DOM行爲。

<ul> 
    <my-result> 
    <li></li> 
    </my-result> 
    <my-result> 
    <li></li> 
    </my-result> 
</ul>

我一直在使用replace: true試過，但是這導致了TypeError：

definition.match不是一個函數

有人點我在這裏向正確的方向？也許我應該使用屬性指令，但是我不確定如何綁定隔離範圍項目？

我的指令是這樣的：

var template = require('text!./template.html'); 

return function() { 
    return { 
     restrict: 'E', 
     scope: { 
      select: '&', 
      result: '=', 
     }, 
     template: template, 
    }; 
};

我使用的是ng-repeat來呈現結果：

<ul> 
    <my-result 
    ng-repeat="result in results" 
    result="result" 
    select="select({result:result})" 
    > 
    </my-result> 
</ul>

我使用角1.4。

來源

2016-07-05 Ben

替換選項已棄用。（從1.3我認爲？）

如果您的指令模板包含<ul>元素，它會更好看。在這種情況下，您不會遇到在<ul>和<li>之間填入指令元素的問題。

如果你沒有其他選擇，因爲你說你仍然可以使用該指令爲<li>的屬性，像這樣：

<ul> 
    <li my-result 
    ng-repeat="result in results" 
    result="result" 
    select="select({result:result})" 
    > 
    </li> 
</ul>

結果和選擇仍然應該提供給您的指令的範圍。

來源

2016-07-05 08:58:09 gyc

您可以冒險猜測爲什麼'ng-replace：true'會導致TypeError？ – Ben

@BenAston我想看看'select'屬性。我猜你不能在那裏傳遞一個論點。由於您可以訪問指令的作用域，因此您可以在指令的控制器中運行this.select（result） – gyc

AngularJS控制通過指令呈現的精確DOM

回答

相關問題