在表单中使用 Ionic 切换

Question

使用 Angular 和 Ionic，如何在表单内使用 Ionic 的切换（作为输入）？

Answer 1

您只能在分配 ng-model 时使用它。

<ion-toggle ng-model="option.isSelected" toggle-class="toggle-calm">
  {{option.title}}
</ion-toggle>

如果您正在遍历模型列表，您可以尝试这样的操作：

<ion-toggle ng-repeat="option in options" ng-model="option.isSelected" toggle-class="toggle-calm" >
  {{option.title}}
</ion-toggle>

Answer 2

对于 ionic 2，推荐的语法是：

<ion-item>
  <ion-label>Name of the toggle</ion-label>
  <ion-toggle checked="true"></ion-toggle>
</ion-item>

如果你想访问切换的状态，你需要将它绑定到你的控制器的一个成员。在 angular 2 中，双向绑定的语法是这样的：

<ion-item>
  <ion-label>Name of the toggle</ion-label>
  <ion-toggle [(ngModel)]="toggleStatus" checked="true"></ion-toggle>
</ion-item>

在您的控制器中，变量 this.toggleStatus 将是一个布尔值，您可以读取它以获取用户输入，或更改以在屏幕上设置切换状态。

Using Ionic toggle inside a form