點擊從輸入類型收音機獲取價值

我有一個按鈕組，其中我有樹型輸入類型的收音機。我使用這些的原因是爲了獲得我爲我的項目工作而購買的樣式模板，我必須使用完全相同的元素。點擊從輸入類型收音機獲取價值

按鈕組是控制上的動態表的大小，以及我需要時的按鈕（輸入）被按壓

<div class="btn-group" data-toggle="buttons" (click)="pageSizechanged($event)" > 
    <label class="btn btn-success"> 
      <input type="radio" name="options"> 10 
    </label> 
    <label class="btn btn-success"> 
      <input type="radio" name="options"> 20 
    </label> 
    <label class="btn btn-success active"> 
      <input type="radio" > 30 
    </label> 
</div>

我使用的事件發射角2所以我試圖結合輸入與值（未顯示）沒有運氣...

更新

標記爲解決以下只是部分地解決了我的問題，我只能按一次每個輸入答案。爲了解決這個問題，我做了以下工作：

<div class="btn-group"> 
    <label class="btn btn-success"> 
     <input type="radio" style="display:none" value="10" (change)="pageSizechanged($event.target)" > 10 
    </label> 
    <label class="btn btn-success"> 
     <input type="radio" style="display:none" value="20" (change)="pageSizechanged($event.target)"> 20 
    </label> 
    <label class="btn btn-success"> 
     <input type="radio" value="30" style="display:none" (change)="pageSizechanged($event.target)"> 30 
    </label> 
</div>

在更改事件中，我將目標傳遞給了目標。我這樣做是因爲我想將檢查設置爲false：

pageSizechanged(target) { 
    this._pagesize = target.value; 
    target.checked = false; 
    ... 
}

否則輸入將保持檢查狀態，因此更改事件不會被觸發。如果有人有更好的方式來做到這一點，請分享:)

來源

2016-08-10 methgaard

不完全確定你想達到什麼，但如果我理解正確。

您可以使用ngModel綁定單選按鈕，並避免當前點擊事件發生，而是對更改作出反應。以下模板可以工作，只需在組件類中定義您的tableSize變量即可。

<div class="btn-group"> 
    <label class="btn btn-success"> 
     <input type="radio" name="options" [(ngModel)]="tableSize" value="10"> 10 
    </label> 
    <label class="btn btn-success"> 
     <input type="radio" name="options" [(ngModel)]="tableSize" value="20"> 20 
    </label> 
    <label class="btn btn-success active" > 
     <input type="radio" [(ngModel)]="tableSize" value="30"> 30 
    </label> 
</div> 

Current tableSize: {{tableSize}}

如果你需要一個事件，你可以添加一個(change)="myFunc($event.target.value)"到輸入標籤爲好。

來源

2016-08-10 09:30:21 Terje

謝謝！這爲我解決了它！ – methgaard

我不認爲無線電輸入目前在angular2中得到很好的支持。 (you seem to have to make your own component)。

我用他們的（點擊）事件的簡單事件處理，像這樣：

<label class="chart__controls__item" *ngFor="let choice of ['competitor','taxonomy']"> 
    <input type="radio" 
     name="options" 
     (click)="selectedChoice = choice" 
     [checked]="choice === selectedChoice" > 
     No 
</label> 
<label> 
    <input type="radio" 
     name="options" 
     [checked]="choice === selectedChoice" 
     (click)="selectedChoice = choice > 
     Yes 
</label>

因此，如果我們用selectedChoice='Yes'初始化，第二個單選按鈕將被選中。 [checked]屬性確保選中的單選按鈕被選中，(click)指令觸發模型更改。

來源

2016-08-10 08:02:08 dafyddPrys

點擊從輸入類型收音機獲取價值

回答

相關問題