如何更改位置以在 Angular 中打開另一個頁面？

Question

我的問題是如何使用 Angular 更改 URI。 換句話說，當一個函數被調用時，我想改變頁面。

這是我的角度代碼

app.controller('meetupsController', ['$scope', '$resource', function ($scope, $resource) {
  var Meetup = $resource('/api/meetups');

  Meetup.query(function (results) {
    $scope.meetups = results;
  });

  $scope.meetups = []

  $scope.createMeetup = function () {
    var meetup = new Meetup();
    meetup.name = $scope.meetupName;
    meetup.$save(function (result) {
      $scope.meetups.push(result);
      $scope.meetupName = '';
    });
  }
}]);  

我想在調用函數createMeetup時更改頁面。

Answer 1

您可以使用以下方法為瀏覽器設置新網址：

$window.href.location = 'http://...'

如本答案所述：

https://stackoverflow.com/a/27941966

正如 Gregório Kusowski 所提到的，建議使用 ui-router 進行高級路由或創建 SPA（單頁應用程序）。 通常不需要導航到一個全新的 URL 來創建新對象（會議、用戶等）

注意：將 $window.href.location 語句放在 $save “回調函數”中。 如果你把它放在外面，你的頁面會改變，但你的聚會數據可能沒有時間保存。

另請注意，以這種方式更改頁面將刪除您的范圍變量和其他所有內容。 就像您刷新了頁面一樣。 我確定那不是你想要的。 閱讀 ui-router 以獲得最佳結果。

Answer 2

最簡單的方法是使用window.location = '...';

Angular 有$location服務，但為了構建應用程序，我建議您使用路由庫。 甚至 angular 團隊也推薦使用ui-router 。

Answer 3

app.controller('meetupsController', ['$location,$scope', '$resource', function ($location,$scope, $resource) {
  var Meetup = $resource('/api/meetups');

  Meetup.query(function (results) {
    $scope.meetups = results;
  });

  $scope.meetups = []

  $scope.createMeetup = function () {
    var meetup = new Meetup();
    meetup.name = $scope.meetupName;
    meetup.$save(function (result) {
      $scope.meetups.push(result);
      $scope.meetupName = '';
$location.path('/newValue') <!-- it should be the path you want -->

    });
  }
}]);