Выберите значение параметра по умолчанию из машинописного углового 6

Ответ 1

Вы можете сделать это:

<select  class='form-control' 
        (change)="ChangingValue($event)" [value]='46'>
  <option value='47'>47</option>
  <option value='46'>46</option>
  <option value='45'>45</option>
</select>

// Note: You can set the value of select only from options tag. In the above example, you cannot set the value of select to anything other than 45, 46, 47.

Здесь вы можете использовать это.

Ответ 2

app.component.html

<select [(ngModel)]='nrSelect' class='form-control'>
  <option value='47'>47</option>
  <option value='46'>46</option>
  <option value='45'>45</option>
</select>

app.component.ts

import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  nrSelect = 47
}

Ответ 3

Для реактивной формы мне удалось заставить ее работать, используя следующий пример (47 можно заменить другим значением или переменной):

<div [formGroup]="form">
  <select formControlName="fieldName">
    <option
        *ngFor="let option of options; index as i"
        [selected]="option === 47"
    >
        {{ option }}
    </option>
  </select>
</div>

Ответ 4

Правильный путь будет:

<select id="select-type-basic" [(ngModel)]="status">
    <option *ngFor="let status_item of status_values">
    {{status_item}}
    </option>
</select>

Значение следует избегать внутри опции, если значение должно быть динамическим, так как это установит значение по умолчанию для "Выбрать поле". Выбор по умолчанию должен быть связан с [(ngModel)], и параметры должны быть объявлены аналогичным образом.

status : any = "47";
status_values: any = ["45", "46", "47"];

Ответ 5

Сначала или все вы используете ng-модель, которая считается синтаксисом angularjs. Используйте [(ngModel)] вместо значения по умолчанию

App.component.html

<select [(ngModel)]='nrSelect' class='form-control'>
    <option value='47'>47</option>
    <option value='46'>46</option>
    <option value='45'>45</option>
</select>

App.component.ts

import { Component } from '@angular/core'; 
@Component({ 
    selector: 'my-app', 
    templateUrl: './app.component.html', 
    styleUrls: [ './app.component.css' ] 
}) 

export class AppComponent { 
    nrSelect:string = "47" 
}

Ответ 6

У меня были похожие проблемы с Angular6. Пройдя много сообщений. Мне пришлось импортировать FormsModule, как показано ниже в app.module.ts.

import {FormsModule} from '@angular/forms';

Затем работал мой тег ngModel. Пожалуйста, попробуйте это.

<select [(ngModel)]='nrSelect' class='form-control'>                                                                
                                <option [ngValue]='47'>47</option>
                                    <option [ngValue]='46'>46</option>
                                    <option [ngValue]='45'>45</option>
</select>

Ответ 7

Я думаю, что лучший способ сделать это, чтобы связать его с ngModel.

<select name="num" [(ngModel)]="number">
                <option *ngFor="let n of numbers" [value]="n">{{n}}</option>
              </select>

и в тс файл добавить

number=47;
numbers=[45,46,47]

Ответ 8

я справляюсь с этим, делая так =>

<select class="form-control" 
        [(ngModel)]="currentUserID"
        formControlName="users">
        <option value='-1'>{{"select a user" | translate}}</option>
            <option 
            *ngFor="let user of users"
            value="{{user.id}}">
            {{user.firstname}}
   </option>
</select>