2017-04-24 146 views
0

这里是我的模板离子复选框人选择值

<ion-list > 
      <ion-item> 
       <ion-label>This month</ion-label> 
       <ion-checkbox checked=true></ion-checkbox> 
     </ion-item> 
     <ion-item> 
       <ion-label>Previous month</ion-label> 
       <ion-checkbox></ion-checkbox> 
     </ion-item> 
     <ion-item> 
       <ion-label>last 3 month</ion-label> 
       <ion-checkbox></ion-checkbox> 
     </ion-item> 
      <ion-item> 
       <ion-label>This Year</ion-label> 
       <ion-checkbox></ion-checkbox> 
     </ion-item> 
      <ion-item> 
       <ion-label>Previous Year</ion-label> 
       <ion-checkbox></ion-checkbox> 
     </ion-item> 
     <ion-item> 
       <ion-label>All Time</ion-label> 
       <ion-checkbox></ion-checkbox> 
     </ion-item> 
     </ion-list> 

我选择的任何值ex This.month并同时选择上month.and还检查了2 values.I需要只检查前一个月。

我该怎么做。

u能帮助我...

感谢&问候。

回答

0

您可以使用复选框警报将多选的结果保存到变量中。

在你的HTML有一个按钮调用你的函数

<button ion-button block (click)="selection()">Filter</button> 

在你.TS处理警报呈现和数据。

import { AlertController } from 'ionic-angular'; 

constructor(public alerts: AlertController){} 

selection() { 
    let a = this.alerts.create({ 
     title: 'My select', 
     inputs: [ 
      { type: 'radio', label: 'This Month', value: 'This Month' }, 
      { type: 'radio', label: 'Previous Month', value: 'Previous Month' }, 
      { type: 'radio', label: 'Last 3 Months', value: 'Last 3 Months' }, 
      { type: 'radio', label: 'This Year', value: 'This Year' }, 
      { type: 'radio', label: 'Previous Year', value: 'Previous Year' }, 
      { type: 'radio', label: 'All Time', value: 'All Time' }, 
     ], 
     buttons: [ 
      { 
       text: 'Cancel', role: 'cancel' 
      }, 
      { 
       text: 'Ok', 
       handler: data => { 
        // DATA IS AN STRING ONLY, IF YOU SELECT 'ALL TIME' THEN DATA WILL BE 'ALL TIME' 
       } 
      }] 
    }) 

    a.present(); 
} 

如果需要此屏幕上没有戒备的形式,检查的官方文档的radio buttons

希望这会有帮助