單選按鈕在Angular 2中無法正常工作

我們有一個angular2組件，我們擁有某些單選按鈕。我在某些條件下檢查單選按鈕。單選按鈕在Angular 2中無法正常工作

單選按鈕的HTML代碼去爲：

<span class="radio-switch-group"> 
 
    <label> 
 
\t <input type="radio" name="radioView" id="All" (click)="onBtnClick('All')" [checked]="currentTab === 'All'"> 
 
\t <span class="radio-label">ALL Cars</span> 
 
    </label> 
 
    <label> 
 
     <input type="radio" name="radioView" id="Honda" (click)="onBtnClick('Honda')" [checked]="currentTab === 'Honda'"> 
 
     <span class="radio-label">Honda</span> 
 
    </label> 
 
</span>

TS文件如下：

 export class CarComponent implements OnInit{ 
     @Input() public currentTab: string = 'All'; 

     public onBtnClick(carType: string){ 
      this.currentTab = carType; 
     } 

     public ngOnInit() { 
      this.currentTab = 'All'; 
     } 
    }

當我在標籤視圖實例化此組件從另一個組件單選按鈕不檢查即使當currentTab設置爲 '全部'

來源

2017-05-08 hannah

這個代碼是爲我工作得很好，請其他地方的複選框值清零 – sainu

我在實例化一個標籤這個組件檢查你的代碼，它不在這種情況下工作。 – hannah

相反@input的（），聲明就像下面的變量：

export class CarComponent implements OnInit{ 
    public currentTab: string = 'All'; 

    public onBtnClick(carType: string){ 
     this.currentTab = carType; 
    } 

    public ngOnInit() { 
     this.currentTab = 'All'; 
    } 
}

@input負責一個方式angular2結合。

希望它有幫助！

來源

2017-05-08 11:47:45

試過了，它沒有工作。 :( – hannah

'@ Input'也是雙向的 - 它取決於父元素如何使用它。 – Cody

嘗試使用[value]屬性綁定的輸入。在Angular中使用[selected]或[checked]的IIRC基本上在做以下工作。

if ([checked]===[value])

<span class="radio-switch-group"> 
 
    <label> 
 
\t <input type="radio" name="radioView" id="All" (click)="onBtnClick('All')" [value]="'All'" [checked]="currentTab"> 
 
\t <span class="radio-label">ALL Cars</span> 
 
    </label> 
 
    <label> 
 
     <input type="radio" name="radioView" id="Honda" (click)="onBtnClick('Honda')" [value]="'Honda'"[checked]="currentTab"> 
 
     <span class="radio-label">Honda</span> 
 
    </label> 
 
</span>

來源

2017-05-08 16:01:13

單選按鈕在Angular 2中無法正常工作

回答

相關問題