預選角度數據不顯示在Select2多選菜單中

Question

我有一個使用Select2（4.0.3）和Angular（1.4.9）的項目。其中一種使用Angular控制器和雙向數據綁定的表單加載包含許多網站的聯繫人模型，以及服務器中可用網站的列表。該數據分別被添加到contact對象和sites數組中，這是控制器的屬性。我已經實現了Select2多選，允許用戶更新屬於該聯繫人的網站列表。

<select 
    name="sites" 
    class="form-control m-b js-example-basic-multiple site-select" 
    multiple="multiple" 
    data-placeholder="Select Sites" 
    ng-model="contact.sites"> 
    <option 
     ng-repeat="site in sites" 
     ng-bind="site.name" 
     value="{{ site.id }}"> 
    </option> 
</select> 

此實現的問題是，它不顯示數據第一次加載時已經屬於該聯繫人的站點。

在從服務器獲取數據之前select元素變爲Select2，其中$(".site-select").select2();。

將Angular和Select2集成在一起解決此問題的最佳方法是什麼？

Answer 1

我通過直接添加NG-選項來選擇元件和完全除去顯式選項元素解決這樣的：

<select 
    name="sites" 
    class="form-control m-b js-example-basic-multiple site-select" 
    multiple="multiple" 
    data-placeholder="Select Sites" 
    ng-model="contact.sites" 
    ng-options=" 
     site as site.name 
     for site in sites 
     track by site.id 
    "> 
</select>