角度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选择与图像

回答

相关问题