Ionic+cordova+angularJS 项目实现IPhone 下拉框滚动效果

方法一：

在index.html 引入如下文件

 <link rel="stylesheet" href="../css/mui.min.css">
   <link rel="stylesheet" type="text/css" href="../css/app.css" />
<link href="../css/mui.picker.css" rel="stylesheet" />
<link rel="stylesheet" type="text/css" href="../css/mui.picker.min.css" />
<link href="../css/mui.poppicker.css" rel="stylesheet" />

 <script src="js/muijs/mui.js"></script>
    <script src="js/muijs/mui.picker.js"></script>
    <script src="js/muijs/mui.dtpicker.js"></script>
    <script src="js/muijs/mui.poppicker.js"></script>

然后在你当前画面添加如下代码

    <button id='showUserPicker' class="mui-btn mui-btn-block" type='button' ng-click='ShowSelect();'>一级选择示例 ...</button>

$scope.ShowSelect=function(){
        var userPicker = new mui.PopPicker();
        userPicker.setData([{ value: 'ywj', text: '董事长 叶文洁' }, { value: 'aaa', text: '总经理 艾AA' }, {
            value: 'lj',
            text: '罗辑'
        }, {
            value: 'ymt',
            text: '云天明'
        }, {
            value: 'shq',
            text: '史强'
        }, {
            value: 'zhbh',
            text: '章北海'
        }, {
            value: 'zhy',
            text: '庄颜'
        }, {
            value: 'gyf',
            text: '关一帆'
        }, {
            value: 'zhz',
            text: '智子'
        }, {
            value: 'gezh', 
            text: '歌者'
        }]);
        userPicker.show(function(items) {
            alert(JSON.stringify(items));
        });

 

 

 

转载于:https://my.oschina.net/u/227828/blog/901763