Angular: $ locationProvider.html5Mode (true) Ausgabe Routing

Question

ich die # von meiner URLs entfernen möchten, so habe ich den Code unten:

angular.module('building') 
    .config(['$stateProvider', '$locationProvider', 
     function ($stateProvider, $locationProvider) { 

      // Turn on #-less links. 
      $locationProvider.html5Mode(true); 

      $stateProvider 
       .state('building', { 
        url:'/building', 
        templateUrl: 'app/modules/building/building.html', 
        controller: 'BuildingQuery', 
        controllerAs: 'vm' 
      }) 

    }]); 

Und ich habe <base href="/"> in meiner index.html Datei.

Und der Code funktioniert ... irgendwie.

Wenn ich einen Link wie folgt eingeben ...

http://127.0.0.1:4000/#/building 

Dann leitet der Browser die URL ...

http://127.0.0.1:4000/building 

und die Seite lädt.

Allerdings, wenn ich diese URL eingeben ...

http://127.0.0.1:4000/building 

dann ...

Cannot GET /building 

Da die # URLs richtig umleiten, ich weiß $locationProvider.html5Mode(true);etwas tut.

Irgendwelche Ideen? Es könnte nützlich sein zu wissen, dass ich angm verwende, um die Module zu generieren.

Answer 1

aus dem Winkel docs:

mit [html5mode] erfordert auf Server-Seite URL-Rewriting, im Grunde Sie alle Ihre Links zum Eintrittspunkt der Anwendung neu zu schreiben (zB index.html) . Die Angabe eines <Basis> Tags ist ebenfalls wichtig für diesen Fall, da es Angular erlaubt, zwischen dem Teil der URL, der die Anwendungsbasis ist, und dem Pfad, der von der Anwendung behandelt werden soll, zu unterscheiden .

I.e. Sie müssen Ihrem Server mitteilen, dass er alle Anfragen an /index.html neu erstellen soll.

Answer 2

evsheino wies mich in die richtige Richtung. Es ist nichts falsch mit meinem Code, es war die Serverkonfiguration, die Probleme verursacht. Alles, was ich tun musste, war die folgende meiner gruntfile.js

middleware: function (connect, options) { 
    var optBase = (typeof options.base === 'string') ? [options.base] : options.base; 
        return [require('connect-modrewrite')(['!(\\..+)$/[L]'])].concat(
         optBase.map(function(path){ return connect.static(path); })); 
       }, 
       keepalive: true, 
       port: 4000, 
       base: '.', 
       hostname: 'localhost', 
       debug: true, 
       livereload: true, 
       open: true 
      } 
     } 
    }, 

Vollständige Erklärung finden Sie hier hinzufügen: http://jjt.io/2013/11/16/angular-html5mode-using-yeoman-generator-angular/

EDIT: Diese