각도 2의 첫 번째 옵션 선택

Question

다음의 첫 번째 옵션을 어떻게 선택합니까? 프로그래밍 방식으로 모델에 선택 하시겠습니까?

<select class="form-control" [(ngModel)]="data" name="data" (ngModelChange)="onSortChange($event)"> 
      <option [ngValue]="{data:'car', color: 'green'}">green car</option> 
      <option [ngValue]="{data:'engine', color: 'blue'}">blue engine</option> 

Answer 1

ViewChild와 로컬 템플릿 변수를 사용하여 옵션을 사용할 수 있습니다.

로컬 템플릿을 추가하는 것처럼보기를 변경하십시오.

<select class="form-control" [(ngModel)]="data" name="data" (ngModelChange)="onSortChange($event)"> 
     <option [ngValue]="{data:'car', color: 'green'}">green car</option> 
     <option [ngValue]="{data:'engine', color: 'blue'}">blue engine</option> 
    </select> 

컨트롤러에서 옵션에 액세스하여 선택할 속성을 선택할 수 있습니다.

import { Component, OnInit, ViewChild, ElementRef } from '@angular/core'; 

@Component({ 
    moduleId: module.id, 
    templateUrl: 'home.component.html' 
}) 

export class HomeComponent implements OnInit { 
    @ViewChild('carSelect') carSelect: ElementRef; 

    constructor() { } 

    ngOnInit() { } 

    setSelected(): void { 
     this.carSelect.nativeElement.children[0].selected = true; 
    } 
}