角度ui選擇與圖像

我想顯示{country flag圖標+名稱+電話撥號代碼}的列表，我已經使用ui選擇實現這在角度，這是我已經使用的代碼角度ui選擇與圖像

<ui-select ng-model="viewModel.homePhoneCountryCode" theme="bootstrap" id="homePhoneCountryCode" name="homePhoneCountryCode" ng-disabled="disabled"> 
    <ui-select-match> 
     {{$select.selected.phoneCode}} 
    </ui-select-match> 
    <ui-select-choices repeat="country in countries | filter: $select.search"> 
     <img ng-src="{{country.imageUrl}}" /> 
      <span ng-bind-html="country.name | highlight: $select.search"></span> 
      <span ng-bind-html="country.phoneCode | highlight: $select.search"></span> 
    </ui-select-choices> 
</ui-select>

的列表顯示了罰款，除非似乎有一些性能問題，當點擊列表中選擇一個選項，它不是單獨的第一次，有一個滯後，但在隨後的點擊，以及即使圖像正在被瀏覽器緩存。

有大約在列表中的標誌圖標從http://www.famfamfam.com/lab/icons/flags/ 236項，面積

另一個問題相對較小的是，在當文本輸入到搜索/過濾器輸入時間的頁面似乎被卡住並帶有一條消息，表明長時間運行js是原因。

問題1：這是在列表中顯示遠程圖像的正確方法。

問題2：在ui-select中是否有延遲加載的方法。

問題3：如果這是與ui-select有關的問題，那麼我還有另外一個可以探索的方法。

來源

2016-04-30 Abhilash G Raja

雖然我還沒有親身體驗過這個問題，但我確實在查看您所描述的角度回購是否存在任何問題。我遇到了this link，似乎有一個性能問題與ui選擇選擇和很多圖像。根據@askhogan：

我相信性能問題是由於ui-select-choices指令中的ng-repeat機制。我註釋了代碼的這一部分，並且該應用程序再次變得響應。看起來，選擇下拉列表的選擇是立即得到處理，而不是當它被點擊時。如果您在同一頁面上有幾個選擇*幾個select-ui搜索框，則會大大減慢頁面加載速度。我認爲，解決的辦法是推遲下拉選擇的處理，直到用戶點擊其中的選擇的用戶界面搜索框，但我仍在調查......

不幸的是這似乎是一個持續的問題。我通讀了其中的一些內容，以瞭解各種各樣的黑客成員。

來源

2016-04-30 20:56:31 SimonStern

嗯是剛剛遇到該鏈接，似乎移動到https://github.com/machineboy2045/angular-selectize將是一個不錯的選擇 –

問題2：僅用於延遲加載圖像。我用bootstrap旋轉木馬，我有一些懶惰加載圖像數組的問題。我所做的是創建2個不同的陣列 - 一個與當前的3個圖像，並與所有其他圖像存在。在第一個數組中，我只加載3個圖像，每次點擊next或perv按鈕，我從第二個數組中取出另一個圖像，並將其替換爲第一個數組（我希望我足夠清楚）。

來源

2016-04-30 20:54:53

是的，這可以與旋轉木馬一起工作，但我恐怕我需要堅持選擇列表 –

角度ui選擇與圖像

回答

相關問題