jQuery 移动 Multi-Select 来自异步数据

jQuery Mobile Multi-Select from asynchronous data

我在使用 jQuery 手机和 AngularJS 时遇到一点问题。

我想要一个 multi-select 以便用户可以选择一个类别。类别有 parents 和子项。整个结构来自数据库,因此它是一个异步调用来获取数据。

问题是 select 元素有数据但不显示数据,除非您单击第一个空选项。

也许我会展示比讲述更好

http://plnkr.co/edit/7UwGjSRfGEnhIvSrtGjV

<div ng-show="catsready" id="jqselect">
  <label for="multiselect" class="select">Multi-select:</label>
  <select id="multiselect" multiple="multiple" data-native-menu="false" data-icon="bars" data-iconpos="left">
    <option>Choose a few options:</option>
    <optgroup ng-repeat="parent in cats" label="{{parent.name}}">
      <option ng-repeat="child in parent.childs" value="" jq-select>{{child.name}}</option>
    </optgroup>
  </select>
</div>

在 angular 拥有 added/changed 选项组和选项后,您需要告诉 jQM 刷新选择菜单小部件:

$("#multiselect").selectmenu("refresh", true);

API 文档:http://api.jquerymobile.com/selectmenu/#method-refresh