2016-04-11 10 views
0

現在、私はこの方法でAngular Jsルーティングを使用していますが、うまくいきます。カスタムanglejsルートURL

config(["$routeProvider", function ($routeProvider, $mdThemingProvider) { 
     $routeProvider 
      .when('/', { 
       templateUrl: '/templates/home.html', 
       controller: 'smu72Controller' 
      }) 
     .when('/contact', { 
      templateUrl: '/templates/contact.html', 
      controller: 'smu72Controller' 
     }) 
      .when('/objects', { 
       templateUrl: '/templates/objects.html', 
       controller: 'smu72Controller' 
      }) 
      .when('/objects/:objectId', { 
       templateUrl: '/templates/object.html', 
       controller: 'smu72Controller' 
      }) 
      .when('/services', { 
       templateUrl: '/templates/services.html', 
       controller: 'smu72Controller' 
      }) 
     .otherwise({ 
      redirectTo: "/" 
     }); 
    } 
    ]); 

しかし、このコードで私が探して醜いだと私はhost/sectionnameとしてルートのURLを取得するには、これを変更する方法host/index.html#sectionname、とフレンドリーURLはSEOではありませんか?

P.S. Index.htmlページのng-viewでテンプレートを取得しています。私たちは、デフォルト角度では醜い#

config(function($routeProvider, $locationProvider) { 
    $routeProvider 
      .when('/', { 
       templateUrl: '/templates/home.html', 
       controller: 'smu72Controller' 
      }) 
    /* your all other route specifications */ 

    $locationProvider.html5Mode(true); 
} 
+0

ありがとうございます、両方の答えは実際に正しいので、私はちょうど古いものを選択します。 –

答えて

1

(HTML5 History APIの使用は)と呼ばれるものhashbangモードを使用して、あなたはこれをオフにすることができますHTML5モードを使用してください - これで良いURLが得られますが、古いブラウザでは動作しません。これを有効にするには、アプリのレシバーの設定セクションに以下の行を入れて$locationProviderを注入してください。

$locationProvider.html5Mode(true);

よりここhttps://docs.angularjs.org/guide/$locationをお読みください。

+0

ちょうどコードをダンプしないで、何か説明を加えてみてください – dreamweiver

+0

@dreamweiver、そうですが、この答えは十分にクリアです。 –

+0

@dreamweiverありがとう、編集済み – manish

1

を取り除く$locationProviderモジュールを使用してtruehtml5Modeを設定することにより、