当前位置: 首页 > 面试题库 >

Angular UI-Router使用go函数在状态之间传递数据不起作用

陆洲
2023-03-14
问题内容

我刚刚开始学习angularjs,并且正在使用angular-ui-
router。我正在尝试使用一种状态将数据从一种状态发送到另一种状态,$state.go但是我没有成功。这是我到目前为止的内容:

我没有故意包含html,因为我假设不需要它,请告诉我,我将添加它。

我将状态配置如下:

  $stateProvider
        .state('public', {
            abstract: true,
            templateUrl: 'App/scripts/main/views/PublicContentParent.html'
        })
        .state('public.login', {
            url: '/login',
            templateUrl: 'App/scripts/login/views/login.html',
            controller: 'loginCtrl'
        })

    $stateProvider
        .state('private', {
            abstract: true,
            templateUrl: 'App/scripts/main/views/PrivateContentParent.html'
        })
        .state('private.visits', {
            url: '/visits',
            views: {
                'main': {
                    controller: 'visitsListCtrl',
                    templateUrl: 'App/scripts/visits/views/VisitsList.html'
                }
            }
        });

LoginController调用my时,将执行以下代码

loginModule.controller('loginCtrl', ['$state', function ($scope, $state) {

    $state.go('private.visits', { name : "Object"});

}]);

private.visits页面处于活动状态时,我正在尝试打印$stateParams

visitsModule.controller('visitsListCtrl', ['$stateParams',
    function ($stateParams) {

        console.log($stateParams);


    }]);

正如状态所示,$ stateParams是一个空对象。我希望它包含我在loginCtrl中传递的对象。

编辑

看来,如果private.visitsurl具有这种url格式,'/visits/:name'并且我还添加了属性params:[“
name”]我可以访问从public.login状态发送的对象。副作用是将参数添加到逻辑上的URL。

我尝试在没有url的子状态下执行相同的操作,在这种情况下,我似乎无法访问从中传递的参数public.login

如何在子状态下发送数据?


问题答案:

您需要做的是name在如下private.visits状态下定义参数:

$stateProvider
    .state('public', {
        abstract: true,
        templateUrl: 'App/scripts/main/views/PublicContentParent.html'
    })
    .state('public.login', {
        url: '/login',
        templateUrl: 'App/scripts/login/views/login.html',
        controller: 'loginCtrl'
    })

$stateProvider
    .state('private', {
        abstract: true,
        templateUrl: 'App/scripts/main/views/PrivateContentParent.html'
    })
    .state('private.visits', {

        // NOTE!
        // Previously, we were only passing params as an array 
        // now we are sending it as an object. If you 
        // send this as an array it will throw an error 
        // stating id.match is not a function, so we updated 
        // this code. For further explanation please visit this
        // url http://stackoverflow.com/a/26204095/1132354
        params: {'name': null},

        url: '/visits',
        views: {
            'main': {
                controller: 'visitsListCtrl',
                templateUrl: 'App/scripts/visits/views/VisitsList.html',
                resolve: {
                        name: ['$stateParams', function($stateParams) {
                            return $stateParams.name;
                        }]
                    }
            }
        }
    });

然后在控制器中访问名称:

visitsModule.controller('visitsListCtrl', ['name',
function (name) {
    console.log(name);
}]);

希望对您有所帮助!



 类似资料:
  • 问题内容: 我正在做一个文档编辑器。文档可以是Type A或TypeB。可以通过URL通过文档ID对其进行访问,但是如果文档是A或B类型,则该ID不能使它们清晰可见。 因此,我需要按id加载文档,根据其数据确定其类型,然后将其传递给TypeAController或TypeBController。 现在,使用ui-router,我有类似以下内容: 加载状态将加载文档,确定其类型,然后进入下一个状态。

  • 但是控制台显示一个错误: 未捕获的 DOMException:无法在 “History” 上执行 'pushState':无法克隆 Symbol(react.element)。 这是什么意思?对此我能做些什么?

  • 我正在创建一个用户设置帐户使用故事板的5个步骤。每个步骤都有一个ViewController:1:)输入姓名、联系人等,2:)导入照片,3:)输入等4:)更多输入5:)确认页面,如果用户点击“确认”->获取所有输入并上传解析。 我在网上搜索时得到的唯一解决方案是创建一个函数“Prepare for Segue”并传递信息...但对我来说,这没有任何意义: 如果我有1000个viewcontroll

  • 本文向大家介绍使用vue-router在Vue页面之间传递数据的方法,包括了使用vue-router在Vue页面之间传递数据的方法的使用技巧和注意事项,需要的朋友参考一下 前言 几周前,我写了关于 Vue 路由的使用和在 Vue 页面导航的文章。这是在应用程序中探索的一个基本例子。 通常,在将导航构建到应用程序中时,您会发现需要将数据从一个页面传递到另一个页面。(不通顺)例如,您遵循 master

  • 我的Navbar组件有2个子组件。每个组件都有自己的状态。在其组成部分内工作正常的国家。如何更新这两个状态从假到真的同时,当两个功能onclick将被执行? 主组件导航栏 列表菜单组件 汉堡包成分

  • 我在Galaxy Note(gt-n7000)上遇到了一个问题。由于一些变化的需求,我似乎无法通过startActivity(intent)在两个活动之间直接传递数据。所以我实现了一个单例类: } 在我的第一个活动中,我在IntentStack中放置了如下数据: 在我的第二个活动中,我试图达到一个目的: 其中核心。getIm()。getClassName(string)从映射中获取其值,该映射在应