zoukankan      html  css  js  c++  java
  • angularjs 页面跳转传递参数

    基于ui-router的页面跳转传参

    ① app.js中

            .state('faceWarning',{
                url: '/faceWarning',
                templateUrl: 'pages/face/faceWarning.html',
                controller: 'WarningCtrl'
            })
            .state('faceWarningList',{
                url: '/faceWarningList/:groupId',
                templateUrl: 'pages/face/faceWarningList.html',
                controller: 'WarningListCtrl'
            })

    ② faceWarning.html中点击跳转事件  

    ng-click="jumpWarningList(data.groupId)"

    faceWarning.js中,定义页面跳转函数 (使用ui-router的$state.go接口):
    faceApp.controller('WarningCtrl', ['$rootScope', '$scope', '$state',
        function($rootScope, $scope, $state) {
             $scope.jumpWarningList = function(groupId) {
                $state.go('faceWarningList', {groupId: groupId});
            };
      }]);

    ③ faceWarningList.js,通过ui-router的$stateParams获取参数groupId

    faceApp.controller('WarningCtrl', ['$rootScope', '$scope', '$stateParams',
        function($rootScope, $scope, $stateParams) {
             $scope.searchSpecial.groupId = $stateParams.groupId;
      }]);

    这种跳转,在不传递参数时,url: '/faceWarningList/:groupId', 这里将会影响单独跳转的实现,导致点击无效。

    如果要实现单独点击跳转(主页面不带参数跳转),需要在app.js中定义参数,不然$state.go在传输之后在目标controller接受的时候会被filter过滤掉

            .state('faceWarningList',{
                url: '/faceWarningList',
                templateUrl: 'pages/face/faceWarningList.html',
                params: {'groupId': null},
                controller: 'WarningListCtrl'
            })
  • 相关阅读:
    本周开发工作时间及内容
    自我介绍
    代码规范
    结对编程
    第二周总结
    20140227WPF学习笔记
    约瑟夫问题
    模式匹配KMP算法
    .NET开发之窗体间的传值转化操作
    北达软TOGAF9鉴定级别认证考试通知 北达软
  • 原文地址:https://www.cnblogs.com/miny-simp/p/7910069.html
Copyright © 2011-2022 走看看