根據數據

Question

NG重複節目內容比方說，我有以下對象：

{ 
    "items": [ 
     { "type": "groupA", "name": "title 1" }, 
     { "type": "groupB", "name": "title 2"} 
    ] 
} 

我有以下ng-repeat以下事情：理想

<div ng-repeat="item in data.items"> 
    {{ item.name }} 
</div> 

，我很高興能夠成爲能夠顯示我如何顯示item.name，具體取決於類型。

因此，舉例來說，如果型等於A組想我有：

<input value="{{ item.name }}" /> 

而且如果型等於B組，我想有：

<div>{{ item.name }}</div> 

這可能嗎？有沒有人對我如何完成他的任何建議？我是新的角，所以任何幫助將不勝感激。

Answer 1

一種方式做，這是被稱爲ngIf角條件表達式：

<div ng-repeat="item in data.items"> 
    <div ng-if="item.type == 'groupA'"> 
     <input value="{{ item.name }}" /> 
    </div> 
    <div ng-if="item.type == 'groupB'"> 
     <div>{{ item.name }}</div> 
    </div> 
</div> 

更多關於角ngIf函數這裏：https://docs.angularjs.org/api/ng/directive/ngIf

的第二種方式是示出基於相應的元件關於item.type的值，使用ngShow：

<div ng-repeat="item in data.items"> 
    <input ng-show="item.type == 'groupA'" value="{{ item.name }}" /> 
    <div ng-show="item.type == 'groupB'" />{{ item.name }}</div> 
</div> 

更多關於ngShow她e：https://docs.angularjs.org/api/ng/directive/ngShow

第三種方法是開關。儘管開關可能會顯示出兩種類型的元素類型之一，但它們可能會混雜在一起。更多關於開關在這裏：https://docs.angularjs.org/api/ng/directive/ngSwitch

編輯：多一點澄清補充說。

Answer 2

你可以在ng-repeat中使用ng-if指令。試試這個： -

<div ng-repeat="item in data.items"> 
    <input ng-if="item.type == 'groupA'" value="{{ item.name }}" /> 
    <div ng-if="item.type == 'groupB'"> 
     {{ item.name }} 
    </div> 
    </div> 

Answer 3

您可以使用ng-if。例如：

<div ng-repeat="item in data.items"> 
    <div ng-if="item.type == 'groupA'"> 
     <input value="{{ item.name }}" /> 
    </div>  
    <div ng-if="item.type == 'groupB'"> 
     {{ item.name }} 
    </div>  
</div>