AngularJS-UI-маршрутизатор не загружает представление

Я в приложении, которое используетangular-route, и я пытаюсь интегрировать ui-routerв определенный модуль. В этот модуль я не включил angular-route.

Все ui-srefURL-адреса будут генерировать штраф, но когда пользователь пытается перейти к представлению, он возвращается к root.

Может angular-routeи ui-routerсо-смешаться?

angular.module('StyleGuide', ['ui.router'])
  .config(['$stateProvider', '$urlRouterProvider',
    function ($stateProvider, $urlRouterProvider) {

        $urlRouterProvider.otherwise('/StyleGuide/');

        // Configure UI-Router
        $stateProvider
            .state('styleguide', {
                url: '/StyleGuide/',
                templateUrl: 'App/StyleGuide/styleguide.html'
            })
            .state('styleguide.sandbox', {
                url: '/StyleGuide/Sandbox',
                templateUrl: 'App/StyleGuide/sandbox/sandbox.html',
                controller: 'SandboxController'
            });
    }
  ]);

HTML

<div class="sgHeader">
    <div class="navbar navbar-default">
        <nav class="container-fluid">
            <ul class="nav navbar-nav">
                <li class="dropdown open" uib-dropdown >
                    <a role="button" class="dropdown-toggle" uib-dropdown-toggle aria-haspopup="true" aria-expanded="true">
                        <i class="fa fa-bars"></i>
                    </a>
                    <ul class="dropdown-menu" uib-dropdown-menu aria-labelledby="simple-dropdown">
                        <li><a ui-sref="styleguide.sandbox"><i class="fa fa-hourglass-start"></i>Sandbox</a></li>

                    </ul>
                </li>
            </ul>
            <div class="navbar-header">
                <a class="navbar-brand" ui-sref="styleguide"><span class="heavy">Soar </span>Styleguide</a>
            </div>
        </nav>
    </div>
</div>
<div class="sg__body" ui-view>
    <div style="text-align: center;">
        <h1>The Soar Style Guide, this is.</h1>
        <h3>Use it to promote codebase and visual consistency, you will.</h3>
        <img src="https://s-media-cache-ak0.pinimg.com/originals/49/7d/80/497d80f923e70aaa558d17c9cd1ee142.gif" />
    </div>
</div>

2 ответа

  1. В детском состоянии — ‘ styleguide.sandbox ‘ измените URL-адрес с ‘/StyleGuide/Sandbox’ на ‘/Sandbox’. Так как вы уже упомянули песочницу, чтобы быть дочерним styleguide, маршрутизатор автоматически обработает URL для песочницы как ‘/StyleGuide/Sandbox’, вам не нужно специально упоминать его.