angularjs - $stateProvider 没有按预期加载页面

Question

我正在尝试将 $stateProvider 用于我的 url 路由。我想如果我使用$stateProvider，那么我就不需要使用$routeProvider了。这个对吗？我能够让我的 url 路由与 $routeProvider 一起工作，但我无法让我的 url 路由与 $stateProvider 一起工作。这是我到目前为止的代码:

var app = angular.module("app",['ui.state']);
app.config(function($urlRouterProvider, $stateProvider, $locationProvider) {

$urlRouterProvider.otherwise("/home") 

$stateProvider
    .state('home', {
        url: "/home",
        controller: 'HomeCtrl',
        views: {
            main: { templateUrl: "views/home/main.html" }
            sub: { templateUrl: "views/home/sub.html" }
        }
    })
    .state('products/info', {
        url: "/products/info",
        controller: 'ProductsCtrl',
        views: {
            main: { templateUrl: "views/products/main.html" },
            sub: { templateUrl: "views/products/info/sub.html" } 
        }
    })
    .state('products/reviews', {
        url: "/products/reviews",
        controller: 'ProductsCtrl',
        views: {
            sub: { templateUrl: "views/products/reviews/sub.html" } 
        }
    })

在我的“外壳”html 页面上，我有以下内容:

<div class="main">
    <div ui-view="main"></div>
    <div ui-view="sub"></div>
</div>

当我访问我的任何 url 时，我只看到 shell html 页面。没有任何内容被加载到我的 ui-view 中。我错过了什么？

Answer 1

在这里，你的状态类型'products/reviews'是错误的，它应该是'products.reviews'