Question

$stateProvider
  .state("home", {
    url: "/home",
    templateUrl: "templates/home.html",
    controller: "homeCtrl"
  })
  .state("home.abc", {
    url: "/abc/:id",
    templateUrl: "templates/abc.html",
    controller: "abcCtrl"
  })
  .state("home.abc.xyz", {
    url: "/xyz",
    templateUrl: "templates/xyz.html",
    controller: "xyzCtrl"
  })
  .controller('abctrl', function($scope, $state, $stateParams) {
    $state.go('home.abc.xyz', {
      'id': $stateParams.id
    });
  })

-----状态进入home.abc.xyz之后它又一次回到了家乡状态。请让我知道是谁解决了这个问题？

Answer 1

尝试这样的事情。

//...
.state("home.abc.xyz", {
    url: "/xyz",
    templateUrl: "templates/xyz.html",
    controller: "xyzCtrl",
    params:{
       id: null
    }
  })

修改

我花了一些时间来了解问题是什么，下面是解决方案。简单来说，ui.router没有任何问题，但是，您的配置是错误的。让我试着解释一下。

当您请求xyz州，ui.router拳头加载主页模板时，它会尝试在abc内加载home模板，最后{{1}进入xyz。由于您可能在模板中没有正确的HTML（正如我在下面的代码中所做的那样）abc仅加载ui.router模板，因为它知道放置它的位置。我希望你能在这里理解问题和解决方案。

home

<强>的index.html

$stateProvider .state("home", { url: "/home", templateUrl: "templates/home.html", controller: "homeCtrl" }) .state("home.abc", { url: "/abc/:id", views:{ 'abc': { templateUrl: "templates/abc.html", controller: "abcCtrl" } } }) .state("home.abc.xyz", { url: "/xyz", views:{ 'xyz': { templateUrl: "templates/xyz.html", controller: "xyzCtrl" } } }) .controller('abctrl', function($scope, $state, $stateParams) { //this should not be part of any controller. /*$state.go('home.abc.xyz', { 'id': $stateParams.id });*/ })

<强> home.html的

<body> <div ui-view></div> <body>

<强> abc.html

<div ui-view="abc"></div>

Answer 2

感谢您的回复。

最后这个解决方案有效。

app.run（function（$ rootScope，$ location，$ state，$ stateParams）{ $ rootScope。$ on（＆＃34; $ stateChangeStart＆＃34;，function（event，toState，toParams，fromState，fromParams）{

        if(toState.name == "home.abc") {

            $state.go('home.abc.xyz', {'id': toParams.id});

        }
    });
})

$ state.go也在调用它的父控制器

2 个答案: