2017-09-26 29 views
0

角度と角度のある材質2を使用してmd-selectコンポーネントに問題があります。selectの値を変更しても、md-selectの値は変わらず、私の場合はデフォルトで選択されたオプション "LTC"です。私は、現在選択されているオプションを表示する必要があります。 ご協力いただきありがとうございます!選択後にMd選択値が変更されない

component.ts

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

@Component({ 
    selector: 'app-allcoins', 
    templateUrl: './allcoins.component.html', 
    styleUrls: ['./allcoins.component.scss'] 
}) 
export class AllcoinsComponent implements OnInit { 

    regTypeSelectedOption: string = "LTC"; 
    selectedNav: any; 
    navs = ['LTC', 'ETH', 'ZEC', 'XRP'] 

    constructor() { } 

    setNav(nav:any){ 
    this.selectedNav = nav; 
     if(this.selectedNav == "LTC"){ 
      this.regTypeSelectedOption = "LTC"; 
     } 
     else if(this.selectedNav == "ETH"){ 
      this.regTypeSelectedOption = "ETH"; 
     } 
     else if(this.selectedNav == "ZEC"){ 
      this.regTypeSelectedOption = "ZEC"; 
     } 
     else if(this.selectedNav == "XRP"){ 
      this.regTypeSelectedOption = "XRP"; 
     } 
    } 

    ngOnInit() { 
    this.selectedNav = 'select value'; 
    } 

} 

HTML

<div class="main-content"> 
    <div class="container-fluid"> 
     <div class="row"> 
      <div class="col-md-8"> 
       <div class="card"> 
        <div class="card-header card-header-text"> 
         <h4 class="card-title">Comprar Criptodivisas</h4> 
         <p class="category">Seleccione la criptodivisa que desea comprar</p> 
        </div> 
        <div class="card-content"> 
         <md-select placeholder="Moneda" [(ngModel)]="regTypeSelectedOption"> 
          <md-option [value]="regTypeSelectedOption" (click)="setNav(item)" *ngFor="let item of navs">{{item}}</md-option> 
         </md-select> 
         <app-comprarzec *ngIf="regTypeSelectedOption === 'ZEC'"></app-comprarzec> 
         <app-comprarxrp *ngIf="regTypeSelectedOption === 'XRP'"></app-comprarxrp> 
         <app-comprarltc *ngIf="regTypeSelectedOption === 'LTC'"></app-comprarltc> 
         <app-comprareth *ngIf="regTypeSelectedOption === 'ETH'"></app-comprareth> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 
</div> 

答えて

0

あなたはそれがイベントを発生しますので、それはあなたが新しいオプションが選択されるたびにcontrollようになる。この場合(change)=""に変更イベントを使用する必要があります。

すべての値が[value]="regTypeSelectedOption"で、デフォルトで「LTC」と指定している場合は、NgModelではregTypeSelectedOptionを使用する必要がありますが、値には使用しないでください。

EDITお使いの場合には

(あなたはMD-オプションの値が項目に等しい見ることができるように):

<md-option [value]="item" (click)="setNav(item)" *ngFor="let item of navs">{{item}}</md-option> 

は、それが動作願っています。

+0

回答ありがとうございました。私はちょうど –

+0

を学習して、ちょうど編集、あなたは今それを得ることを願っています。 –

+0

Manelさん、ありがとうございます。あなたが '(change)=" "' –

関連する問題