在Chrome中使用HTML表單操作更改路線（AngularJS）

Question

我有一個angularJS應用程序，它使用服務在3個控制器之間共享數據。我使用html表單中的按鈕在視圖之間路由。表單的action屬性設置爲目標路由的URL。

在Firefox似乎沒有成爲一個問題，但鍍鉻插入一個問號到URL，這似乎重新啓動應用程序並刪除共享服務：

火狐結果：

「HTTP：//本地主機/對myApp /應用/＃/ thirdScreen」（沒問題）

鉻結果：

「HTTP：//本地主機/對myApp /應用/＃/ THI rdScreen「（丟棄服務，應用程序似乎重新啓動並且共享服務數據丟失）。

但是，連續來回連續數次似乎解決了Chrome中剩餘應用程序生命週期的問題。

• 問號是什麼意思？
• 是否必須使用我的控制器中的$ location服務來改變路線，還是有另一種方法？

謝謝！

的Html

//Extract from the bottom of the secondScreen.html partial 

<div class="col-md-12 column"> 
      <form action="#/thirdScreen"> 
       <button type="submit" class="btn btn-lg btn-block btn-danger"> 
           Go to third page 
       </button> 
      </form> 
</div> 

App.js

angular.module('myApp', [ 
    'myApp.services', 
    'myApp.directives', 
    'myApp.controllers', 
    'myApp.filters', 
    'ngRoute' 
]). 
config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) { 
    $routeProvider. 
     when("/firstScreen", {templateUrl: "partials/firstScreen.html", controller: 'firstScreenController'}). 
     when("/secondScreen", {templateUrl: "partials/secondScreen.html", controller:"secondScreenController"}). 
    when("/thirdScreen", {templateUrl: "partials/thirdScreen.html", controller:"thirdScreenController"}). 
otherwise({redirectTo: '/firstScreen'}); 
}]); 

Controllers.js

controller('secondScreenController', function($scope, $http, sessionDetailsService, modalService, goodsCheckedInFetchingService) { 

    $scope.session = sessionDetailsService; 

}). 

controller('thirdScreenController', function($scope, $http, sessionDetailsService, modalService, goodsCheckedInFetchingService) { 

    $scope.session = sessionDetailsService; 

}). 

Answer 1

我認爲你必須設置$locationProvider.hashPrefix('?')在你的代碼是這樣的：

angular.module('myApp', ['ngRoute']) 
.config(['$locationProvider', function($locationProvider) { 
$locationProvider.html5Mode(false); 
$locationProvider.hashPrefix('?'); 
}]); 

刪除此$locationProvider.hashPrefix('?');從您的代碼。

，或者你沒有設置這個然後把這個代碼在app.js：

angular.module('myApp', ['ngRoute']) 
    .config(['$locationProvider', function($locationProvider) { 
    $locationProvider.html5Mode(false); 
    $locationProvider.hashPrefix(''); 
    }]);