Angular2 ngModel選擇 - 處理對象

我有以下結構：Angular2 ngModel選擇 - 處理對象

<select ngbDropDown class="form-control" id="disk1" required [(ngModel)]="disk1" name="resourceA"> 
    <option *ngFor="let r of disks" [value]="r">{{r.name}}</option> 
</select>

我想將R對象傳遞給ngModel disk1的，這是我的組件的屬性：

disk1 = new Disk();

但是，如果我嘗試訪問它後，更改選擇框我得到undefined：

console.log("Disk1 id: " + this.disk1.id);

任何想法？謝謝！

來源

2016-09-23 nehemia

是'disk1'和'disks'意思是同一個對象嗎？ – candidJ

我們可以分配對象到[值]嗎？我懷疑 –

@candidJ disk1和磁盤是我的組件中2個不同的屬性。磁盤將從Web服務器檢索項目，而disk1將從選擇框中保存實際值。 – nehemia

你可以上點擊使用功能選項，並分配一個功能選擇在您的組件，如：

<select ngbDropDown class="form-control" id="disk1" required [(ngModel)]="disk1" name="resourceA"> 
    <option *ngFor="let r of disks" [value]="r" (click)="selected(r)">{{r.name}}</option> 
</select>

在組件

，你應該有這樣的事情：

.Class({ 
    constructor: function() {}, 
    selected: function(element){ 
    this.disk1 = { name:"MyDisk", content: element.content, id: element.id }; 
    } 
})

來源

2016-09-23 17:31:20 damianfabian

這可能會奏效。但是，ngModel僅適用於屬性，並不是要傳遞整個對象？ – nehemia

你可以創建一個對象屬性，我更新了答案給你看。請標記爲已回答您的問題，如果這回答您的問題。 – damianfabian

@nehemia，yes ngModel一次綁定到一個屬性。在你的情況下，你將它綁定到磁盤ID並從組件中的磁盤集合中找到你的對象。 – Pradeep

您可以使用ngValue而不是簡單的值綁定來將對象綁定到option元素。

<select [(ngModel)]="model.selectedItem" name="selectItem"> 
    <option *ngFor="let item of items" [ngValue]="item">{{item.title}}</option> 
</select>

來源

2016-09-23 17:49:19

在Angular2的API參考中找不到與ngValue相關的任何內容：https://angular.io/docs/ts/latest/api/#任何提示？ – nehemia

我編輯了我的答案以提供代碼示例。 –

奇怪的是我在文檔中找不到任何東西，但它適用於我:)前一段時間在stackoverflow上發現該解決方案。 –

Angular2 ngModel選擇 - 處理對象

回答

相關問題