在ng-repeat中創建指令

我有一個指令，我想用它來生成其他指令。以下不工作：在ng-repeat中創建指令

<span ng-repeat="picker in pickers | filter:{type:'click'}"> 
     <span picker.name></span> 
    </span>

我如何使用picker.name創造更多的指令，這裏面NG-重複？

- 背景

我們有一個主要「選擇器服務」中注入了幾個服務「選擇器中局部」，「選擇器Dropbox的」，「選擇器中Google雲端硬盤」的。

function pickerService($filter, pickerDropboxService, pickerGoogledriveService, pickerLocalService){ 
    // list pickers 
    this.pickers = [pickerDropboxService, pickerGoogledriveService, pickerLocalService]; 
}

我們有一個選擇器指令，它基本上是通過採摘循環，並試圖創建一個自定義的指令，爲他們每個人：

 <span ng-repeat="picker in pickers"> 
      {{picker.name}} 
      <span {{picker.name}}></span> 
     </span>

每個挑選（本地，保管箱，Google雲端硬盤）宣佈了一項指令，我想從我的主選擇器指令中使用這個指令。

感謝

來源

2014-04-29 Nicolas

這是一個有效的屬性名稱？它應該是根據AngularJS慣例的選擇器名稱。你有一個名爲pickerName的指令嗎？ –

是的，它是一個有效的屬性名稱{{picker.name}}打印正確的指令名稱，但如果我做了，picker.name不會被正確的指令名稱。 – Nicolas

據我所知，您無法使用範圍變量動態地形成HTML屬性名稱。請提供更多代碼以更好地展示您要完成的任務。 –

最好的解決辦法似乎在指令中使用 '編譯'：

directive.html：

<span id='pickerButtons'></span>

directive.js：

'compile': function(element, attributes) { 

     var pickerButtons = document.querySelector('#pickerButtons'); 
     var span = document.createElement('span'); 
     span.innerHTML = ''; 

     for (var i=0, tot=pickerService.pickers.length; i < tot; i++) { 
      if(pickerService.pickers[i].type === 'button'){ 
       span.innerHTML += '<span><span picker-' + pickerService.pickers[i].name + '></span></span>'; 
      } 
     } 

     pickerButtons.appendChild(span); 

     var linkFunction = function($scope, element, attributes) { 
      $scope['pickFrom'] = function(pickerObject){pickerService.pickFrom(pickerObject);}; 
      $scope['pickList'] = pickerService.getPickList(); 
     }; 

     return linkFunction; 
    }

來源

2014-05-05 18:10:44 Nicolas

在ng-repeat中創建指令

回答

相關問題