Question

我有一个选择输入：

<select id="duration" name="duration" class="form-control select-lg"
          [(ngModel)]="championship.settings.fightDuration">
    <option *ngFor="let duration of durations"
          [selected]="championship.settings.fightDuration==duration"> 
          {{ duration }} {{ championship.settings.fightDuration==duration }}
    </option>
</select>

我的价值在championship.settings.fightDuration

之内

我尝试用以下方式预先选择：

[selected]="championship.settings.fightDuration==duration"

我在选择文本中，我打印出这个条件的结果，并在与值匹配的元素上打印true，所以它应该有效，但是select没有选择的值......

我错过了什么？

Answer 1

如果仍然存在选择默认值的问题，请尝试此操作。

假设您要选择的选项的值为duration。我假设此选项已经在items数组中。

HTML

<select name="someName" [(ngModel)]="someModel">
   <option *ngFor="let key of items" [value]="key.value">{{ key.label }}</option>
</select>

TS

    class someComponent Implements OnInit {

      someModel;

      ngOnInit() { 
          this.someModel = 'duration';
          this.items = [
                            {value: 'duration', label : 'Duration'}, 
                            {value: 'other', label : 'Other'},
                            {value: 'someOther', label : 'Some Other'}
                          ];
      }

提交时

在您的Submit函数内部，只需像这样调用即可获取所选值。

this.someModel

希望这对某人有帮助。

这部影片对我有帮助-https://www.youtube.com/watch?v=8ZlrORYOl_0

Answer 2

您可以使用[ngValue]，如下所示

<option *ngFor="let duration of durations" [ngValue]="duration"> 
      {{ duration }} {{ championship.settings.fightDuration==duration }}
</option>

使用Angular 6选择下拉列表的默认值

2 个答案: