Question

我正在使用ui-router进行角度应用程序，我收到以下错误消息。

错误：无法从状态'static'
解析'static.about'

我不知道为什么。我想要实现的是我的应用程序有两个部分，静态部分，主页，关于，登录，注册和应用程序方面，这些都可能是仪表板，用户配置文件等等我认为我需要设置我的ui像这样的路由器，

app
.config(['$stateProvider', '$urlRouterProvider', 
function($stateProvider, $urlRouterProvider){
// any unknown URLS go to 404
$urlRouterProvider.otherwise('/404');
// no route goes to index
$urlRouterProvider.when('', '/home');
// use a state provider for routing
$stateProvider
    .state('static', {
        url: '/home',
        templateUrl: '',
        views : {
            header : {
                templateUrl : 'app/components/shared/header.html'
            },
            main: {
                templateUrl : 'app/components/home/views/home.view.html' 
            }
        }
    })
    .state('static.about', {
        // we'll add another state soon
        url: '/about',
        templateUrl: 'app/components/about/views/about.view.html',
    })
    .state('app', {
        abstract: true,
        templateUrl: ''
    })
    .state('app.dashboard', {
        url: 'app/dashboard',
        templateUrl : '',
    })        
}]);

然而，这会返回已经提到的错误。我之所以想要设置它的原因是应用程序的两面也有非常不同的布局，所以我想我应该能够将不同的布局推入我的？

我遇到的最大问题是错误，其次是生成的链接，当我点击它时应该转到/关于它，但它会转到/ home / about。

我想要在早期阶段实现的是我的“静态”页面共享导航并具有可互换的主要部分，并且“app”页面具有完整的新布局/父模板

Answer 1

您需要在子视图上设置parent属性。

.state('static.about', {
    url         : '/about',
    templateUrl : 'app/components/about/views/about.view.html',
    parent      : 'static'
})

同时检查此问题的答案Angular ui-router : Parent & Child Views。

我想当你执行$state.go(static.about)时，它会转到homepage，因为你正在做otherwise或类似事情。

赞：$urlRouterProvider.when('', '/home');

Angular-Ui-Router在某些事情不合适时解析主route。

另请注意,末尾添加的额外templateUrl。

Answer 2

上述州的建设是可以的。我创建了一个plunker to demonstrate it here

在root状态＆＃39;静态＆＃39; 我们只是不使用templateUrl ..无论如何都会跳过它，因为我们确实定义了 views : {}

.state('static', { url: '/home', // we want to have views : {} so avoid this shorthand template // templateUrl: '', views: { header: { templateUrl : 'app/components/shared/header.html', }, main: { templateUrl : 'app/components/home/views/home.view.html', } } })

子状态＆＃39; static.about＆＃39; 可以使用 '^' 前导符号，从根目录重置其网址

.state('static.about', { // here we use a switch to inform - this url starts from root //url: '/about', url: '^/about', templateUrl: 'app/components/about/views/about.view.html', })

通过这些电话，一切正常

<a ui-sref="static"> <a ui-sref="static.about">

检查行动here

错误讯息：

错误：无法解决＆＃39; static.about＆＃39;来自州＆＃39;静态＆＃39;

通常情况下，如果我们在状态定义（或呼叫方）中有一个错字。但这不是问题。或者，如果我们省略加载定义文件......

Answer 3

对我来说，似乎你不想在转到static.about时定义一个全新的UI，而是使用静态的头文件。

从static.about
添加一个属性视图，该视图应该是一个名为“main @ static”的对象，该值应该是您的templateUrl的另一个对象。

更多信息：https://github.com/angular-ui/ui-router/wiki/Multiple-Named-Views

UI路由器无法解析状态错误消息

3 个答案: