0

我对 Angular2 还是很陌生,我遇到了 ngSwitch 指令的问题。由于某些我不明白的原因,似乎当我更改大小写时 - 更改选择中的值 - html 被附加到现有的而不是替换。

这是我的模板的一部分:

<select id="typeFC" class="form-control"
                                [(ngModel)]="object.type"
                                (change)="changeFunction()"
                                name="type">
    <option *ngFor="let type of response.types" [value]="type">
                                {{ type }}
    </option>
</select>
<div [ngSwitch]="object.type">
            <div *ngSwitchCase="'value1'" class="row">
                <app-common-card class="col-6"
                                 [nameCard]="'Card One A'">
                </app-common-card>
                <app-common-card class="col-6"
                                 [nameCard]="'Card One B'">
                </app-common-card>
            </div>
            <div *ngSwitchCase="'value2'" class="row">
                <app-common-card class="col-6"
                                 [nameCard]="'Card Two A'">
                </app-common-card>
                <app-common-card class="col-6"
                                 [nameCard]="'Card Two B'">
                </app-common-card>
            </div>

        </div>

在我的组件中,我有这个属性用于初始化。

exampleObject: ObjectType = {
        type: 'value1',
        stuff: 'value2'
    };

当我在 changeFunction 中创建控制台日志时,它会向我显示属性的新值,但 html 部分会附加到已经存在的部分。有人能帮助我吗?

4

0 回答 0