用 ngFor 构建一个 <ion-list radio-group>

Question

我正在尝试使用数组中的 *ngFor 构建离子列表无线电组。我有一系列游戏（id，名称），我只想要一个列表，用户只能在其中选择一个，但局部变量似乎已损坏（应检查第一个，但这也不起作用）。这是我的代码：

<ion-header>
 <ion-navbar>
    <ion-title>
        New match
    </ion-title>
 </ion-navbar>
</ion-header>

<ion-content>
 <ion-list radio-group>
    <ion-list-header>
        Game
    </ion-list-header>
    <ion-item *ngFor="let game of games, let i = index">
        <ion-label>{{ game.name }}</ion-label>
        <ion-radio checked="i == 0" value="game.id"></ion-radio>
    </ion-item>
 </ion-list>
</ion-content>

我做错了什么？有人有想法吗？谢谢

Answer 1

您必须在 checked="i==0" 和 value="game.id" 两边使用双括号 {{}} 像这样：

<ion-radio checked="{{i == 0}}" value="{{game.id}}"></ion-radio>

否则，checked 和 value 属性将内容评估为字符串，而不是表达式。

用 ngFor 构建一个 <ion-list radio-group>

Build an <ion-list radio-group> with ngFor

ionic2