Question

我尝试使用ui-route来控制我的app状态，但我希望状态是面向URL的。

我想点击一个链接，然后自动转到带有相关网址的状态。

我遵循了深入的指南，我的代码看起来像这样（请参阅plnkr https://plnkr.co/edit/wk1RphKq6G3t4GqfppYm）：

JS：

angularModule.config(['$stateProvider', '$urlRouterProvider', function($stateProvider, $urlRouterProvider) {
        //$urlRouterProvider.otherwise("/management");

        $stateProvider
          .state('management', {
            url: '/',
            template: '<p>:)</p>'
          })
          .state('management.users', {
            url: '/users',
            templateUrl: './users.html'
          });
      }]);

HTML：

 <div class="container-fluid" ng-controller="PageController">
            <aside class="sidebar col-md-3">
                <nav>
                    <ul>
                        <li><a href="index.html">Management</a></li>
                        <li><a href="management/users">Users</a></li>
                    </ul>
                </nav>
            </aside>
            <section class="content col-md-9" ui-view>
            </section>
        </div>

我错过了什么？

Answer 1

ui-router拥有自己的html属性，因此不是

ui-sref="management.users"

你应该使用

qs = User.objects.annotate(vote_count=Count('vote')).order_by('-vote_count')

与ui-sref一起使用的路径名是状态名，而不是url路径本身。

看看这个https://github.com/angular-ui/ui-router/wiki/Quick-Reference#ui-sref

希望这会有所帮助

Answer 2

定义状态时，将根状态URL设置为“/”：

$stateProvider
  .state('management', {
    url: '/',       // INSTEAD OF "index.html"
    template: '<p>:)</p>'
  })
  .state('management.users', {
    url: '/users',
    templateUrl: 'users.html'
  });

下一步。您正试图将'dev.api'注入根模块：

angularModule = angular.module('app', [
  'ui.router',
  'ui.bootstrap',
  'dev.api' // HERE
]);

但是你永远不会创建模块。您需要将service.js更改为此：

angular
    .module('dev.api', []); // THIS IS HOW YOU DEFINE A NEW MODULE (Without external dependencies)
angular
    .module('dev.api').service('usersApiService', ['$http', function ($http) { .....

现在您将看到ui-sref正在运行（https://plnkr.co/edit/XbDx2EonQvZYXsyvWhUW?p=preview）。请注意，您仍然有一些JS错误，但这些错误与应用程序的逻辑有关，与问题无关。

使用href属性时，ui-route无法正常工作

2 个答案: