在下拉菜單中設置默認值

在角度2中，我嘗試使用select2和semantic-ui下拉菜單來使用下拉搜索。當它沒有默認值時可以。但是當我在頁面編輯數據中設置默認值時，數據不會顯示默認值。只有當我使用「setTimeout（）」時它纔會顯示值。無論如何，我可以顯示默認值沒有setTimeout？在下拉菜單中設置默認值

HTML（SELECT2版本）

HTML（語義版本）

<select class="form-control ui fluid search dropdown" id="input-contactperson" (change)="setContactPerson($event.target.value)"> 
    <option value="" data-value="">please select</option> 
    <option *ngFor="let contactperson of objContactPerson" [selected]="contactperson.contactPersonId == contactPerson" value="{{contactperson.contactPersonId}}">{{contactperson.contactPersonName}}</option> 
</select>

在HTML上述我用[選擇]以匹配值，而contactPerson等於contactperson.contactPersonId它不會顯示我是否不使用setTimeout（）

組件

setTimeout(function() { 
    // $("#input-contactperson").select2("val", contactpersonid); //select 2 
    $(".ui.dropdown").dropdown("set selected", contactpersonid); // semantic 
}, 500);

來源

2016-10-17 Mahalo Bankupu

使用[attr.value]設置下拉列表的值。

例如：[attr.value] = 「contactperson.contactPersonId」

隨着空安全opeerator

另外，看看你是否在控制檯中得到任何異常。情況可能如此，因爲您可能試圖訪問在呈現模板UI時不可用的數據。像上面一樣使用空安全運算符「？」。這將延遲空/未定義的值，當值可用時，模板將顯示數據。

正如您所提到的，數據僅在超時後顯示。嘗試空安全運營商。它應該工作，你不需要超時。

來源

2016-10-17 05:45:51

我嘗試使用[attr.value]而不是值和「？」但它不顯示默認值。當我添加setTimeout並且不添加時，我可以看到不同的情況。當我添加setTimeout時，我在選定的值中看到div class =「active」，默認值將顯示在下拉列表中，但是當我沒有設置Timeout時，類「active」不會顯示在下拉列表中。看起來像某種渲染UI。無論如何[attr.value]比價值感謝更好。請告訴我，如果你有另一個建議。 –

<select class="select-state" #playerState (change)="0" [(ngModel)]="variable" 
     value="{{variable}}" 
     [disabled]="isPlayerInfoDisabled" [ngClass]="{'highlight':contactInfoError.has('INVALIDSTATE') && isHighlight == true}"> 
    <option *ngFor="let s of states; let i = index" [attr.value]="s">{{statesValue[i]}}</option> 
</select>

只要拿這個例子的參考，就像我爲我做的那樣。它肯定會工作，除非你正在做別的事情。在類中定義這個變量作爲變量：number = 0

來源

2016-10-17 08:27:27

在下拉菜單中設置默認值

回答

相關問題