• Ionic之页面传值


    很多时候,我们都进入一个页面往往都是需要将上一级的数据转入到下一级页面中使用,在传传统的html中时经过url来传值,所以ionic也是沿用了html中的方法。

    但是还是有点区别于html。我们直接在路由中设置一个名字,之后当点击到下一页的时候,将这个值传到下一页中。

    路由设置:

    .state('payType',{
                    url:'/setting/payType?settingType',
                    templateUrl:'views/recharge/payType.html',
                    controller:'payTypeController'
                })

    页面代码:

    <ion-view view-title="充值">
        <ion-content scroll="false">
            <div class="item item-divider" class="fixedTips">
                ----------------------------请选择充值方式---------------
            </div>
            <div class="item item-input" ng-click="ionWchatpay()">
                <ion-item class="pay-wchatpay"></ion-item>
                <span style="margin-left: 20px;">
                    <span style="font-size: 20px;">微信支付</span><br/>
                    支持微信支付
                </span>
    
            </div>
            <div class="item item-input" ng-click="ionAlipay()">
                <ion-item class="pay-alipay"></ion-item>
                <span style="margin-left: 20px;">
                    <span style="font-size: 20px;">支付宝</span><br/>
                    推荐有支付宝账户的用户使用
                </span>
            </div>
        </ion-content>
    </ion-view>

    js 代码:

     $scope.payType = '';
            $scope.ionWchatpay = function () {
                $scope.payType = 'wchatpay';
                console.log("传送type:"+$scope.payType);
                $state.go('payType',{settingType:$scope.payType},{reload:true});
            };

    下一个页面引用代码:

     var settingType = $stateParams.settingType;
     console.log("得到的值"+settingType);

    结果截图:

  • 相关阅读:
    在github上搭建hexo博客
    Docker镜像命令笔记
    Scrapy学习1:安装
    Android安全初学笔记
    Python数据结构01 线性结构
    IOS开发之__bridge,__bridge_transfer和__bridge_retained (转)
    设置字体样式 TTF
    NYTimes Objective-C 编程风格指南
    MQTT简介
    如何将自己编写的app放到真机上运行
  • 原文地址:https://www.cnblogs.com/liziyou/p/6490382.html
Copyright © 2020-2023  润新知