angular——頁面跳轉

頁面跳轉

• 跳到某頁面 （不帶參數, 單純跳轉）

ng-click="action.toPage('tab.home-recommend-topic-detail')"

<!-------------------- 話題精選 ----------------------->
        <section class="white_bg topics ">
            <header class="fix_container ">
                <div class="fix_top_left" id="topics_mark"><i class="icon-topic"></i></div>
                <ul id="topic_title" >
                    <li ng-repeat="topic in data.topics" class="font_16_14 black_title one_line_text" ng-click="action.toPage('tab.home-recommend-topic-detail')">
                        #{{topic}}#
                    </li>
                </ul>
                <button class="btn blue_text_btn fix_top_right" ng-click="">更多</button>
            </header>
        </section>

控制器的代碼：

angular.module('MrTrustApp.controllers')
    .controller('HomeCtrl', function ($scope, $state, StateGo, $ionicPopover, $timeout) {
　　　　　
　　　　　// 跳到某頁面 （不帶參數, 單純跳轉）
        $scope.action.toPage =  function(state){
            StateGo.go(state);
        };
});

• 頁面傳參跳傳

出參頁面：

<div class="buttons" ng-click="action.toSearchResultListPage()">
    <button class="button button-icon button-clear">
        <i class="ion-ios-search-strong"></i>
    </button>
</div>

<!-------------------- 頂部標題 ----------------------->

    <ion-nav-buttons side="left">
        <div class="buttons" ng-click="action.toPage('message-list')">
            <button class="button button-icon button-clear">
                <i class="fa fa-commenting-o">
                    <span class="badge badge-assertive" ng-if="true">9</span>
                </i>
            </button>
        </div>
    </ion-nav-buttons>
    <ion-nav-buttons side="right">
        <div class="buttons" ng-click="action.toSearchResultListPage()">
        <button class="button button-icon button-clear">
                <i class="ion-ios-search-strong"></i>
            </button>
        </div>
    </ion-nav-buttons>
    <ion-nav-title>
        <h1 class="title" ng-click="action.openPopover($event)">
            <button class="button button-clear dropdown_btn" ng-click="action.openPopover($event)">
                信誰<i class="ion-ios-arrow-down"></i>
            </button>
        </h1>
    </ion-nav-title>

//跳到搜索頁
        $scope.action.toSearchResultListPage = function(){
            var outParams = {};
            outParams.pageId = new Date();
            StateGo.go('search-result-list',outParams);
        };

入參頁面：

// 搜索
.state('search-result-list', {
    url: '/search-result-list',
    params: {
        params: null
    },
    templateUrl: 'templates/search/search-result-list.html',
    controller: 'SearchResultListCtrl'
})

angular.module('MrTrustApp.controllers')

    .controller('SearchMoreBigVOrModelResultListCtrl', function ($scope, $stateParams, $ionicHistory, StateGo) {

        //定義數據
        $scope.data = {};


        //入參
        //$scope.inParams = {};
        var inParams = angular.fromJson($stateParams.params);
        var searchType = $scope.data.searchType = inParams.type;   //搜索類型
        var searchText = $scope.data.searchText = inParams.searchText;   //搜索文本


        //定義動作
        $scope.action = {};

        //返回上一頁==========================================
        $scope.action.toPreviewPage = function () {
            if ($ionicHistory.backView()) {
                $ionicHistory.goBack();
            } else {
                StateGo.goHome();
            }
        };

        // 跳到某頁面
        $scope.action.toPage = function (state) {
            StateGo.go(state);
        };

        //搜索操作
        function toSearch(searchText) {

            <!-----------------------TODO:調接口 (函數傳值:搜索文本)-------------------->

            //根據搜索類型不同,調相應接口
            if (searchType == '大V') {

                //====模擬數據====
                if (searchText == '1') {
                    $scope.data.searchResult = [
                        {
                            //頭像,言值 沒有模擬
                            title: '王二小',
                            intro: '窗外的麻雀在電線桿上多嘴,窗外的麻雀在電線桿上多嘴,窗外的麻雀在電線桿上多嘴'
                        }, {
                            //頭像,言值 沒有模擬
                            title: '二小',
                            intro: '窗外的麻雀在電線桿上多嘴,窗外的麻雀在電線桿上多嘴,窗外的麻雀在電線桿上多嘴'
                        }, {
                            //頭像,言值 沒有模擬
                            title: '王小',
                            intro: '窗外的麻雀在電線桿上多嘴,窗外的麻雀在電線桿上多嘴,窗外的麻雀在電線桿上多嘴'
                        }, {
                            //頭像,言值 沒有模擬
                            title: '王二',
                            intro: '窗外的麻雀在電線桿上多嘴,窗外的麻雀在電線桿上多嘴,窗外的麻雀在電線桿上多嘴'
                        }, {
                            //頭像,言值 沒有模擬
                            title: '王二小d',
                            intro: '窗外的麻雀在電線桿上多嘴,窗外的麻雀在電線桿上多嘴,窗外的麻雀在電線桿上多嘴'
                        }
                    ];
                } else if (searchText == '122') {
                    $scope.data.searchResult = [
                        {
                            //頭像,言值 沒有模擬
                            title: '王二小122',
                            intro: '窗外的麻雀在電線桿上多嘴,窗外的麻雀在電線桿上多嘴,窗外的麻雀在電線桿上多嘴'
                        }, {
                            //頭像,言值 沒有模擬
                            title: '二小122',
                            intro: '窗外的麻雀在電線桿上多嘴,窗外的麻雀在電線桿上多嘴,窗外的麻雀在電線桿上多嘴'
                        }, {
                            //頭像,言值 沒有模擬
                            title: '王小122',
                            intro: '窗外的麻雀在電線桿上多嘴,窗外的麻雀在電線桿上多嘴,窗外的麻雀在電線桿上多嘴'
                        }
                    ];

                } else {
                    $scope.data.searchResult = [];
                }
                //====模擬結束====

            } else if (searchType == '模型') {
                //====模擬數據====
                $scope.data.searchResult = [
                    {
                        //頭像沒有模擬
                        title: '驗證日：2016-03-01',
                        intro: '預期點位：大於2048點,預期點位：大於2048點,預期點位：大於2048點,預期點位：大於2048點'
                    }, {
                        //頭像沒有模擬
                        title: '驗證日：2016-03-11',
                        intro: '預期點位：大於2048點,預期點位：大於2048點,預期點位：大於2048點,預期點位：大於2048點'
                    }, {
                        //頭像沒有模擬
                        title: '驗證日：2016-03-22',
                        intro: '預期點位：大於2048點,預期點位：大於2048點,預期點位：大於2048點,預期點位：大於2048點'
                    }, {
                        //頭像沒有模擬
                        title: '驗證日：2016-03-14',
                        intro: '預期點位：大於2048點,預期點位：大於2048點,預期點位：大於2048點,預期點位：大於2048點'
                    }, {
                        //頭像沒有模擬
                        title: '驗證日：2016-03-31',
                        intro: '預期點位：大於2048點,預期點位：大於2048點,預期點位：大於2048點,預期點位：大於2048點'
                    }
                ];
                //====模擬結束====

            } else {
                return false;
            }
        }

        //初始化搜索
        toSearch(searchText);

        //實時搜索
        $scope.action.toSearch = function (searchText) {
            toSearch(searchText);
        };

    });