Question

我正在使用fancySelect https://github.com/tipstrade/ionic-fancy-select和Ionic框架来选择多个选项。

我对Ionic框架有点新意。

问题：我希望默认选择fancySelect中的一些项目。

密码笔：http://codepen.io/anon/pen/QjydZd?editors=101

我该怎么做？

感谢任何帮助。

enter code here

谢谢， DS

Answer 1

它主要是AngularJS，而非离子。初始化将在select中使用的项目数组时，设置item.checked = true;请参阅js源代码中的第164行和codepen中HTML源代码中的第78+行。

<script>
var $scope.countries = [
  {id: 1, name: 'United States', checked: true},
  {id: 2, name: 'Germany',       checked: false}
]
</script>


<ion-toggle
     ng-repeat="item in items"
     ng-if="multiSelect"
     ng-checked="item.checked"
     ng-model="item.checked"
     class="item item-text-wrap">

如果你想用单一选择来做，你必须添加一个设置css类的角度表达式：

ng-class="{selected : item.checked}"

因此标签变为：

<!-- Single select -->
<label
   ng-repeat="item in items"
   ng-if="!multiSelect"
   class="item item-text-wrap"
   ng-class="{selected : item.checked}"
   ng-click='validateSingle(item)'>

在样式表中添加一个类，以便在模式打开时突出显示所选国家/地区：

.selected {
  background-color: red !important;
}

如果您希望将所选国家/地区显示为花式选择的标签，那么这样的/可能会起作用：

$scope.countries_text_single = $scope.countries[0].name;

离子指令fancySelect

1 个答案: