使用$ window将AngularJS路由配置为深层路径

Bra*_*ens 4 javascript angularjs

我有一个Rails应用程序,它有一些复杂的路由.我的Angular应用程序存在于深层URL中,例如/ quizzes/1

我希望这样做Angular是通过在我的路由配置中注入$ window然后嗅探$ window.location.pathName.这似乎不可能,因为应用程序在此阶段抛出"来自myApp的未知提供者:$窗口".

有没有一种最佳实践方法来处理Angular?我想这样做的原因是当应用程序位于深层目录中时使用HTML5模式.

这是我希望的一个例子,http://jsfiddle.net/UwhWN/.我意识到如果它是唯一的选项,我可以在程序的这一点使用window.location.pathname.

HTML:

<div ng-app="myApp"></div>
Run Code Online (Sandbox Code Playgroud)

JS:

var app = angular.module('myApp', [])

  app.config([

    '$window', '$routeProvider', '$locationProvider',

    function($window, $routeProvider, $locationProvider) {

        var path = $window.location.pathname

       // Coming Soon
       // $locationProvider.html5Mode(true)

      $routeProvider
        .when(path + '/start', {
            controller: 'splashScreenController',
            templateUrl: 'partials/splash-screen.html'
        })

        .when(path + '/question/:id', {
            controller: 'questionController',
            templateUrl: 'partials/question-loader.html'
        })

        .otherwise({
          redirectTo: path + '/start'
        })
  }])
Run Code Online (Sandbox Code Playgroud)

Ste*_*wie 6

只有常量和提供程序可以注入配置块.$ window不能注入您的配置块,因为$ window是一项服务.

来自Angular docs:

配置块 - 在提供程序注册和配置阶段执行.只有提供程序和常量才能注入配置块.这是为了防止在完全配置服务之前意外实例化服务.

而且,无论如何你都不需要$ window服务.只需使用<base>标签:

<base href="/quizzes/1/" />
Run Code Online (Sandbox Code Playgroud)

并保持您的路线相对于它.

  • 您能否详细介绍一下如何使用<base href ="/ quizzes/1 /"/>跳过角度路由并导航回服务器? (2认同)