AngularJS 用户友好的配置文件

Question

我在使用 AngularJS 路由时遇到了麻烦。我有以下代码：http://pastebin.com/Q2FqRVrc，我不知道如何添加简短的配置文件，例如：http://domain.tld/username

有什么技巧吗？

Answer 1

看起来您找到的链接用于使用内置的 ng-route 指令，但您已使用 angular-ui-router 标记了此问题。这就是使用 ui-router 的 $stateProvider 配置您的应用程序的配置。

angular.module('myApp', ['ui.router'])
  .config(function ($stateProvider) {
    // Configure my routes with ui-router
    $stateProvider
      .state('user-profile', {
        url: '/:username',
        templateUrl: 'app/profiles/template.html',
        controller: 'UserProfileCtrl',
        controllerAs: 'upCtrl'
      })
      // These are nested states, under `user-profile`
      .state('user-profile.images', {
        template: '<div my-images-directive></div>'
      })
      .state('user-profile.friends', {
        template: '<div my-friends-directive></div>'
      })
      .state('otherPage', {
        url: '/other-page',
        templateUrl: 'app/otherpage/template.html'
      });
  });

要进入一个状态，您可以使用$state 对象的$state.go 方法。

$state.go('user-profile', {username: $scope.user.name});

要摆脱哈希 #，您需要使用 $locationProvider.html5Mode(true) 开启 HTML5 模式