方法無限期地評估

你能告訴我爲什麼這個方法getAlphabetCharacter()無限期地被評估，即使它只有2個項目（0和1）？我怎樣才能避免它？方法無限期地評估

的.html

<ion-item *ngFor="let i of inputs;let index = index"> 
    <ion-label><span>{{getAlphabetCharacter(index)}}</span></ion-label> 
    <ion-radio value="{{index}}" (ionSelect)="toggleChoiceOther(i.label)"></ion-radio> 
</ion-item>

.TS

getAlphabetCharacter(index: number): string { 
    return String.fromCharCode(65 + index); 
    } 


this.inputs= [ 
     { 
      "encode": "M", 
      "display": "He", 
      "label": "gender" 
     }, 
     { 
      "encode": "F", 
      "display": "She", 
      "label": "gender" 
     } 
    ],

來源

2017-05-17 Sampath

有什麼'inputs'內容？ – developer033

請參閱更新@ developer033 – Sampath

*方法無限期評估*。是的，當您在模板中以這種方式調用方法時會發生這種情況。這是正常的行爲..欲瞭解更多解釋請參閱[**這個問題**]（http：// stackoverflow。COM /問題/ 43081810/angular2無限 - 環 - 當-I-呼叫方法-從-A-angular2級-內部-templa）。所以，你可以做的就是使用** Array＃map **併爲每個對象* alphaChar *創建一個新的屬性（類似這樣），所以你可以在模板中訪問'i.alphaChar'。檢查此[** PLUNKER **]（http://plnkr.co/edit/0u0xfYoGoUSMEPjCojfp?p=preview）。 – developer033

方法評估無限期

這是在模板中以這種方式調用方法時的正常行爲。

更多解釋請參見this question。

爲了解決你的問題，你可以如下使用陣列＃地圖併爲每個對象創建一個新的屬性（像alphaChar），這樣你就可以在模板訪問i.alphaChar，：

組件：

this.inputs.map((elem, i) => elem.alphaChar = this.getAlphabetCharacter(i));

模板：

<ion-label><span>{{i.alphaChar}}</span></ion-label>

DEMO

編輯＃1（沒有真正涉及到原來的問題）：

我注意到你正在使用多個單選按鈕，這樣你必須用屬性包裝它們，如中所述3210：

<ion-list radio-group> 
    <ion-list-header> 
    Alphabet 
    </ion-list-header> 
    <ion-item *ngFor="let i of inputs;let index = index"> 
    <ion-label><span>{{i.alphaChar}}</span></ion-label> 
    <ion-radio [value]="index" (ionSelect)="toggleChoiceOther(i.label)"></ion-radio> 
    </ion-item> 
</ion-list>

PLUNKER

另外，如果你想選擇的值綁定變量，就在radio-group屬性的同一級別添加[(ngModel)]。

例：

<ion-list radio-group [(ngModel)]="myVariable">...</ion-list>

來源

2017-05-17 23:47:27 developer033

我在這裏有一個小問題。你可以看到我的HTML模板也使用'i.label'。我怎樣才能得到，當我只從'map'返回一個變量時，方法？ – Sampath

在我的無法選擇單選按鈕的蹦牀上？ – Sampath

*當我只從地圖方法返回一個變量時，我怎麼能得到這個結果？*不，你不是隻返回'map'中的一個變量。你正爲'array'中的每個對象創建一個新的*屬性*。請檢查更新。 – developer033

方法無限期地評估

回答

相關問題