7

私はまだangularjsを学んでいるので、理解していない愚かなものがあるかもしれませんが、ルーティングを使用すると本当に奇妙な動作をします。

私のアプリケーションでは、次のコードを使用してルートを定義します。

var app = angular.module('app', []);
app.config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider) {
  $routeProvider.
    when('/pneumatici/:chunka', {}).
    when('/pneumatici/:chunka/:chunkb', {});

  $locationProvider.html5Mode(true);
}]);

そしてコントローラーでは、次のように管理します。

app.controller('appCtrl', ['$scope', '$route', '$routeParams', '$location', function ($scope, $route, $routeParams, $location) {
  $scope.$on('$routeChangeSuccess', function (current,previous) {
    if (!($location.path().indexOf('/pneumatici') === -1)) {
      $scope.chunka = $route.current.params.chunka; $scope.chunkb = $route.current.params.chunkb;

      /** do my stuff with chunka and chunkb **/

    } else {
      window.location.href = $location.path();
    }
  });

ngView もテンプレートも何もありません。それは魅力のように機能します。

URLがコントローラーappCtrlによって管理されることを意図していない場合に備えて、実際にページの読み込みを強制する行に注意してください。「$ routeChangeSuccess」をキャッチするようにルートを定義すると、クリックしたときにページ内のすべてのリンクがAngularによってキャッチされ、リンクに「when」で定義されたフォーマットがなくてもページの読み込みが発生しないため、そうする必要がありました。「そうでなければ」でやりたいと思っていましたが、可能であれば方法がわかりませんでした。

今問題。 もちろん、ページには「/privacy.html」のようなリンクがあります。それらをクリックすると、ページの読み込みが正しくトリガーされ、「/privacy.html」が表示されますが、残念ながら、戻るボタンをクリックすると表示されますブラウザーの URL が (たとえば) /pneumatici/foo/bar に変更されますが、ページの読み込みはトリガーされません。

privacy.html ページには、Angular ルーティングが定義されていないことに注意してください。.config も .when; もありません。コントローラーを使用して定義された anagular アプリがありますが、「$routeProvider」の注入はどこにもなく、ルートの定義もありません。

何が起こっている?私が間違っていることは何ですか?

助けてくれてありがとう!

アップデート。 追加する実行可能なソリューションを見つけました:

angular.element("a").prop("target", "_self");

「ターゲット」が「_self」に設定されているすべての「a」要素では、角度ルーティングが無視されますが、それは知りませんでした。

それでも、この戦略を全体として見ると、私にはあまり洗練されていないように思えます。改善したいと思っています。私が気に入らないのは、.config でルートを定義しているので、そこで定義した形式/パスに一致しない URL をスキップするように angular に指示できるはずです。

しかし、それが実行可能かどうかはわかりませんが、誰か知っている人はいますか?

4

2 に答える 2

1

html5mode をオンにすることで、アプリはデフォルトでサイト上のすべてを (「/」から) インターセプトするように動作する必要があります。

その観点から、 $location.path() は明示的なオーバーライドで機能するはずですが、実際には正しくなく ($location.url()そうなるでしょう)、ブラウザーには既に正しい URL があるため、リロードを強制できない可能性があります特定のブラウザでlocation.href = location.href 。

その道をたどるのではなく、DRYにするために次のことを行います。

ベース href を追加する場合:

<base href="/pneumatici/"></base>

そしてあなたの句/pneumatici/で置き換えます:/when

$routeProvider.
    when('/:chunka', {}).
    when('/:chunka/:chunkb', {});

次に、これが必要なだけです:

$scope.$on('$routeChangeSuccess', function (current,previous) {

    $scope.chunka = $route.current.params.chunka;
    $scope.chunkb = $route.current.params.chunkb;

  /** do my stuff with chunka and chunkb **/
});
于 2013-08-09T14:19:32.527 に答える