呼叫指令使用控制器範圍內的數據

Question

我的控制範圍有數據這樣，

$scope.feeds = [{ 
     directive: 'photo-added', 
     user: { 
      ... 
     }, 
     images: [ 
      {id: 150, image: "image.png"}, 
      {id: 151, image: "image.png"}, 
      {id: 152, image: "image.png"} 
     ] 
    }, 
    { 
     directive: 'new-question', 
     question_id : 5, 
     title : "Call directive using controller scope data" 
    }]; 

所有的數組對象有「指令」屬性。我想爲每個對象調用正確的指令。喜歡這個;

<div ng-repeat="feed in feeds"> 
     <{{feed.directive}} info="feed"></{{feed.directive}}> 
    </div> 

當然這是行不通的。我怎樣才能調用正確的指令？

Answer 1

您必須手動編譯HTML，如果你想擁有動態指令名稱。你可以爲此目的建立一個多種輔助指令：

.directive('directive', function($compile) { 
    return { 
     scope: {info: '='}, 
     link: function(scope, element) { 
      var attrs = {info: 'info'}; 
      attrs[scope.info.directive] = ''; 
      element.attr(attrs).removeAttr('directive'); 
      $compile(element)(scope); 
     } 
    }; 
}); 

，並使用它是這樣的：

<div ng-repeat="feed in feeds"> 
    <div directive info="feed"></div> 
</div> 

演示：http://plnkr.co/edit/AjpfM1MqVvFFmykAqa9L?p=preview

Answer 2

你可以讓你的指令是通過類實例化「限制：‘C’」

然後執行：

<div ng-repeat="feed in feeds"> 
     <div ng-class="feed.directive" info="feed"></div> 
</div>