Javascript 根据范围值添加指令

我在控制器的作用域中有一个数组，如

$scope.data = [{
   "name" : "test",
   "type" : "test"
 },{
   "name" : "production",
   "type" : "production"
 }]

现在在视图中，我正在对模型数据执行一个循环，我有两个指令，一个是测试，另一个是生产。我想根据类型在ng repeat中显示这些指令。所以我写了

<div ng-repeat="item in data">
  <test ng-if="item.type == 'test'"></test>
  <production ng-if="item.type == 'production'"></production>   
</div>

这很好，但我的问题是，如果有更好的方法，可以根据模型的类型值在dom中添加这些指令，而不是添加这些ng。我试着说：

<{{item.type}}></{{item.type}}>

---

但是很明显，它不起作用。

为什么不尝试使用一个唯一的指令，其中包含可以用作条件的范围数据：

<div ng-repeat="item in data">
  <directive data-env="item.type" data-name="item.name"></directive>
</div>

---

在指令中，您可以使用

$scope.env

执行条件操作并仅显示您需要的内容。

为什么不尝试使用一个唯一的指令，其中包含一个可以用作条件的范围数据：

<div ng-repeat="item in data">
  <directive data-env="item.type" data-name="item.name"></directive>
</div>

---

在指令中，您可以使用

$scope.env

来执行有条件的操作并仅显示您需要的内容。

还有另一种方法：创建第三个指令：）@K.Toress:这非常有用。但现在我有个问题。我想像这样将该项传递给指令，但在使用$compile使指令动态化之后，我无法编写var html=''；在这种情况下它不起作用。@K.Toress我的意思是，如果我想从指令中显示模型的“name”值，我不想从指令中访问整个数组。还有另一种方法：创建第三个指令：）@K.Toress:这非常有用。但现在我有个问题。我想像这样将该项传递给指令，但在使用$compile使指令动态化之后，我无法编写var html=''；在这种情况下它不起作用。@K.Toress我的意思是，如果我想从指令中显示模型的“name”值，我不想从指令中访问整个数组。实际上，要求指令应该是独立的。我的意思是不同的开发人员将处理不同的指令，最后我们需要根据类型将所有指令集成到一个视图中。实际上要求指令应该是独立的。我的意思是，不同的开发人员将处理不同的指令，最后我们需要根据类型将所有指令集成到一个视图中。