1、npm install ion-multi-picker --save

2、引入

import { MultiPickerModule } from 'ion-multi-picker';
imports: [
  MultiPickerModule,
],
this.simpleColumns = [{
  name: 'col1',
  options: [
    { text: '1', value: '1' },
    { text: '2', value: '2' },
    { text: '3', value: '3' }
  ]
},{
  name: 'col2',
  options: [
    { text: '1-1', value: '1-1' },
    { text: '1-2', value: '1-2' },
    { text: '2-1', value: '2-1' },
    { text: '2-2', value: '2-2' },
    { text: '3-1', value: '3-1' }
  ]
},{
  name: 'col3',
  options: [
    { text: '1-1-1', value: '1-1-1' },
    { text: '1-1-2', value: '1-1-2' },
    { text: '1-2-1', value: '1-2-1' },
    { text: '1-2-2', value: '1-2-2' },
    { text: '2-1-1', value: '2-1-1' },
  ]
}];
3、

<ion-multi-picker item-content [multiPickerColumns]="simpleColumns" [cancelText]="'取消'" [doneText]="'完成'" [(ngModel)]="address"></ion-multi-picker>

ionic下拉多项选择的更多相关文章

  1. ionic 下拉选择框中默认显示传入的参数

    开发过程当中遇到一个有趣的问题,如果我在第一个页面需要把 item { "ownerId" : 1 } 传递给第二个页面,并挂在$scope下 $scope.item = $sta ...

  2. JS年月日三级联动下拉框日期选择代码

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. java总结:Java中获取系统时间(年、月、日)以及下拉菜单默认选择系统年、月、日的方法

    <!-- 获取系统当前的年.月.日 --> <%@ page import="java.util.*"%> <% Calendar calendar= ...

  4. Jquery下拉框左右选择

    1.说明 本文demo实现下拉框左右选择,本文地址:http://www.cnblogs.com/lengzhan/p/6423023.html 2.代码 <!DOCTYPE html PUBL ...

  5. selenium 显示等待wait.until 常用封装 及下拉框的选择操作等

    from selenium.webdriver.common.by import Byfrom selenium.webdriver.support.ui import WebDriverWait a ...

  6. jquery 下拉框左右选择

    html <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <ti ...

  7. 使用 JavaScript 中的 document 对象的属性,根据下拉框中选择的属性,更改页面中的字体颜色和背景颜色

    查看本章节 查看作业目录 需求说明: 使用 JavaScript 中的 document 对象的属性,根据下拉框中选择的属性,更改页面中的字体颜色和背景颜色 实现思路: 在页面的 <body&g ...

  8. Js获取下拉框当前选择项的文本和值

    现在有一个Id为AreaId的下拉框,要获取它当前选择项的文本和值有以下方法: <span class="red">* </span> 地       区: ...

  9. jQuery插件实现select下拉框左右选择_交换内容(multiselect2side)

    效果图: 使用jQuery插件---multiselect2side做法: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitio ...

随机推荐

  1. ubuntu各文件夹简介 [转载]

    原文地址:ubuntu各文件夹简介作者:SuperZhy ubuntu各文件夹简介 /bin 二进制可执行命令/dev 设备文件(硬盘/光驱等)/etc 系统管理和配置文件/etc/rc.d 启动的配 ...

  2. Javascript中双等号(==)隐性转换机制 JS里charCodeAt()和fromCharCode()方法拓展应用:加密与解密

    Javascript中双等号(==)隐性转换机制   在Javascript中判断相等关系有双等号(==)和三等号(===)两种.其中双等号(==)是值相等,而三等号(===)是严格相等(值及类型是否 ...

  3. javaScript 检測 能否够连接指定server

    本文主要讲述怎样在js里面从多个服务端servlet中找到可用的地址 一般项目部署到生产环境之后会有一个生产网段(就是你能够在家訪问)和一个办公网段(仅仅能在公司才干訪问). 我们的项目部署好了之后, ...

  4. tiny4412 裸机程序 七、重定位代码到DRAM【转】

    本文转载自:http://blog.csdn.net/eshing/article/details/37116637 一.关于DRAM 上一章我们讲解了如何对代码进行重定位,但是将代码重定位到只有25 ...

  5. 二分查找法(binary search)

    二分查找法:一种在有序列表中查找某个值的算法,它每次都将待查找的空间分为两半,在其中一般继续查找. 使用二分查找的前提是:已经排序好的列表.否则,sum对其查找的结果不做保证. 代码实现: // 使用 ...

  6. bzoj4668

    并查集+最小生成树 首先我们发现这题可以lct维护最小生成树,但是发现如果生成树在之后是不会修改的,那么就想到了并查集,然后就不知道怎么做了... 其实当我们连接两个连通块的时候,两个连通块只能通过这 ...

  7. CSS3径向渐变实现优惠券波浪造型

    效果看下图: 左右的波浪边框用CSS搞定这个效果.利用CSS radial-gradient() 函数 CSS 语法: background: radial-gradient(shape size a ...

  8. ubuntu下如何查看和设置分辨率 (转载)

    转自:http://blog.csdn.net/jcgu/article/details/8650423 在ubuntu下可以使用xrandr来设置自己需要的分辨率.大致步骤如下: 1.使用xrand ...

  9. 【已解决】Makefile执行过程中出错:make: *** No rule to make target ` ‘, needed by xxx. Stop(转载)

    转自: http://www.crifan.com/makefile_error_make_no_rule_to_make_target_needed_by_stop/ [问题] 有个已有的Makef ...

  10. PCB MS SQL 标量函数(CLR) 实现DataTable转Json方法

    一.准备需转为json字符串的DataTable数据 在数据库中执行一段SQL返回的数据 需转换后的JSON字符串的效果 [{"TechName":"开料",& ...