如何簡化模板？

Question

如何在angularjs中簡化模板？這裏有三種不同的變體位於podgruzki數據對象中，但取決於不同的對象如果使用不同的屬性集加載。是否有可能同時簡化模板

<div class="suggest" ng-show="showSuggest" ng-if="$ctrl.Name == 'A'"> 
    <ul class="height-list"> 
     <li ng-repeat="node in $ctrl.Searched()" ng-mousedown="add(this)"> 
      <span ng-attr-title="{{node.a}}">{{node.a}}</span> 
     </li> 
    </ul> 
</div> 
<div class="suggest" ng-show="showSuggest" ng-if="$ctrl.Name == 'B'"> 
    <ul class="height-list"> 
     <li ng-repeat="node in $ctrl.Searched() " ng-mousedown="add(this)"> 
      <span ng-attr-title="{{node.b}}">{{node.b}}</span> 
     </li> 
    </ul> 
</div> 
<div class="suggest" ng-show="showSuggest" ng-if="$ctrl.Name == 'C'"> 
    <ul class="height-list"> 
     <li ng-repeat="node in $ctrl.Searched()" ng-mousedown="add(this)"> 
      <span ng-attr-title="{{node.C}}">{{node.C}}</span> 
     </li> 
    </ul> 
</div> 

Answer 1

比方說，你歸你node和name是1比1。所以，如果你的控制器名稱爲「A」或「富」，那麼你的node將有一個屬性命名爲a或Foo。

然後你就可以到您的模板減少到以下幾點：

<div class="suggest" ng-show="showSuggest"> 
    <ul class="height-list"> 
     <li ng-repeat="node in $ctrl.Searched()" ng-mousedown="add(this)"> 
      <span ng-attr-title="{{node[$ctrl.Name]}}">{{node[$ctrl.Name]}}</span> 
     </li> 
    </ul> 
</div>