Question

您好我的应用程序中有两个状态称为hello和createHello

下面给出了与两种状态相关的模块。

createHello Module

(function(module){
    'use strict';

    module.config(['$stateProvider',
        function($stateProvider) {
            $stateProvider.state('createHello', {
                url: '/hello/create',
                templateUrl: 'app/createHello/createHello.html',
                controller: 'createHello'
            });
        }
    ]);

})(angular.module('createHello', ['header', 'ui.router', 'timeliner','common']));

你好模块

(function (module) {
    'use strict';

    module.config(['$stateProvider',
        function ($stateProvider) {
            $stateProvider.state('hello', {
                url: '/hello/{id}',
                templateUrl: 'app/hello/hello.html',
                controller: 'hello',
                resolve: {
                    .....
                }
            });
        }
    ]);

})(angular.module('hello', ['header', 'ui.router', 'helloTimer', 'logger', 'timeliner', 'common']));

/hello/xxxx的任何网址格式都将转到hello状态。我希望此特定网址（/hello/create）转到createHello状态。目前它也会进入hello州。关于如何解决这个问题的任何建议？

Answer 1

在这种情况下，您应该使用嵌套状态。

module.config(['$stateProvider',
    function($stateProvider) {
      $stateProvider
        .state('hello', {
          url: '/hello',
          abstract: true,
          template: '<ui-view/>'
        })
        .state('hello.create', {
          url: '/create',
          templateUrl: 'app/createHello/createHello.html',
          controller: 'createHello'
        })
        .state('hello.display', {
          url: '/:id',
          templateUrl: 'app/hello/hello.html',
          controller: 'hello'
        });
    }
]);

请注意，路由是在＆＃34; first match＆＃34;上进行的，因此您需要在/ hello /：id路由之前声明/ hello / create路由。

您可以在此处详细了解嵌套的工作原理： https://github.com/angular-ui/ui-router/wiki/Nested-States-&-Nested-Views

在上面的示例中，我使用了abstract父状态。

根据URL参数更改角度状态

1 个答案: