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);

结果截图:

 

posted @ 2017-03-02 14:20  liziyou  阅读(1143)  评论(0编辑  收藏  举报