2017-02-27 49 views
3

我Angular2 的RC5版我有這樣的事情,他們幾個如何傳遞無效形式的單選按鈕的值?

<input formControlName="uploadType" id="upload_type-parts_service" name="uploadType" value="parts_service" type="radio" />

有一個平變化我勢必

(change)=onUploadTypeChange(???) 

然後我在JS中定義的函數

onUploadTypeChange(uploadType) { 
    this.uploadType = ... 
} 

我有最難的時間試圖讓收音機b utton值。我的計劃是將它傳遞給onchange函數,並更新顯示/隱藏視圖中某些元素的值uploadType。 我試過通過thisthis.valuethis.type.controls.uploadType.value但沒有任何效果。 type是本身的形式。

有人可以請指出我將如何獲得反應形式的值?

+0

[也許這篇文章可以幫助(https://toddmotto.com/angular-2-forms-reactive) – DomeTune

+0

@DomeTune我讀了一個,但在它裏面沒有收音機。事實上,我無法找到反應式無線電處理的良好來源 – Huangism

+0

檢查我的其他問題:http://stackoverflow.com/questions/42443903/after-adding-ngmodel-to-a-radio-button-group - 默認檢查不壽命/ 42446746 – msanford

回答

1

感謝您的意見msanford的問題,我想通了,$event需要傳遞

onUploadTypeChange($event) 

然後在我的js

onUploadTypeChange(e) { 
    this.uploadType = e.target.value; 
} 

target返回輸入本身

我將收音機的值綁定到[value]=...,但這對反應形式不是必需的,而且是造成問題的原因。我設定值只有values="..."

現在一切正常了,{{ this.type.controls.uploadType.value }}打印預期值

1

您是否嘗試過這樣的事情?這監視值更改並將訂閱放入ngAfterViewInit()方法中。

<div class="form-group" [ngClass]="{'has-error': displayMessage.Repeatable }"> 
     <label class="control-label" for="Repeatable">Repeatable</label> 
     <input type="radio" id="Repeatable" [checked]="checked" 
      formControlName="Repeatable" />{{repeatableValue | uppercase}}    
</div> 

// Component 

ngAfterViewInit(): void { 
    console.log('ngAfterViewInit'); 

    this.setForm.get('Repeatable').valueChanges.subscribe(value => this.repeatableValue = value.toString()); 
} 
+1

我沒有試過這個,因爲我不想使用訂閱。我不認爲這是需要在我的情況下,但感謝您的意見 – Huangism