2016-08-09 3 views
1

AngularJS部分の中でDjangoが提供する翻訳サービスに問題があります。 Djangoは私のウェブサイトが初めて読み込まれるときにのみ部分的に内容を翻訳しているようです。現在、私はindex.htmlにDjangoを提供し、各ビューにng-viewディレクティブをロードしています。私はdjangoと角度ルーティングがうまく動作しています。 私のDjangoのテンプレートフォルダの中に私は this structureを持っています。これらのファイルのそれぞれは、ちょうど普通のhtmlテンプレートであり、あるコンテンツはDjangoによって翻訳されています。AngularJS部分(ng-view)内のDjango翻訳の処理

私のジャンゴurls.py

urlpatterns += i18n_patterns(
    url(r'^$', views.homepage, name='index'), 
    url(r'^views/page-home.html/$', views.homeView), 
    url(r'^views/(?P<page>[-\w]+.html)/$', views.angularViews), 
    url(r'^(?P<path>.*)/$', views.angularRedirector), 
) 

そしてapp.js私の角度内側:例えば、

<!-- index.html --> 
{% load static %} 
{% load i18n %} 
<!DOCTYPE html> 
<html> 
<head> 
    <!-- Head stuff [...] --> 
</head> 

<body ng-app="app" ng-controller="controller"> 
    <!-- some content --> 
    <h1>{% trans "Hello world" %}</h1> 

    <!-- Views are injected here --> 
    <div class="page {$ pageClass $}" ng-view></div> 
</body> 
</html> 

とテンプレートの1:

$routeProvider 
    // Load home by default 
    .when('/', { 
     templateUrl: 'views/page-home.html', 
     controller: 'homeController' 
    }) 

    // home page 
    .when('/home', { 
     templateUrl: 'views/page-home.html', 
     controller: 'homeController' 
    }) 

    // contact page 
    .when('/contact', { 
     templateUrl: 'views/page-contact.html', 
     controller: 'contactController' 
    }) 

    // otherwise 
    .otherwise({ 
     redirectTo: '/' 
    }); 

index.html構造は、このようになりますpage-home.htmlは次のようになります。

<!-- page-home.html --> 
{% load static %} 
{% load i18n %} 
<!-- more content --> 
<h2>{% trans "Goodbye World" %}</h2> 

現在、3つの言語(英語、スペイン語、ドイツ語)で作業しています。 localhost:8000をロードすると、Djangoは自動的にlocalhost:8000/es/#/にリダイレクトされます。なぜなら、スペイン語は私のデフォルトのブラウザ言語だからです。物事はトリッキー取得する場所ここで

<!-- [...] --> 
<body ng-app="app" ng-controller="controller"> 
    <!-- some content --> 
    <h1>Hola mundo</h1> 
    <!-- Views are injected here --> 
    <div class="page page-home" ng-view> 
     <!-- more content --> 
     <h2>Adiós mundo</h2> 
    </div> 
</body> 
<!-- [...] --> 

がある:DOMは次のようになりますので、すべてのコンテンツは、きれいにレンダリングされます。 localhost:8000/de/#/またはlocalhost:8000/en/#/に行くと、直接index.htmlのコンテンツは現在の言語に翻訳されますが、ng-viewのコンテンツはそのまま残ります。私はドイツに変更するのであれば、私のDOMは次のようにレンダリングされます:

<!-- [...] --> 
<body ng-app="app" ng-controller="controller"> 
    <!-- some content --> 
    <h1>Hallo welt</h1> 
    <!-- Views are injected here --> 
    <div class="page page-home" ng-view> 
     <!-- more content --> 
     <h2>Adiós mundo</h2> 
    </div> 
</body> 
<!-- [...] --> 

私はlocalhost:8000/en/#/またはlocalhost:8000/es/#/を訪問した場合にのみ、私はドイツにブラウザの言語を変更した場合、すべてのコンテンツはドイツにレンダリングされるか、推測が、 ng-view外のコンテンツが変更されます。私はここで何が起こっているのか分かりません。ブラウザ言語ではなく、URL言語に応じてng-view内で言語を変更するにはどうすればよいですか?

答えて

0

わかりました。 AngularはAccept-Languageヘッダーを1回だけ設定するので、ng-view内のコンテンツはブラウザの言語を考慮して1回のみ翻訳されます。

app.config(["$httpProvider", function($httpProvider) { 
    var language = window.location.pathname.split('/')[1]; 
    $httpProvider.defaults.headers.common["Accept-Language"] = language; 
}]); 

私の問題を解決しました: は、だから私のapp.js構成で私は、URLから言語を保存し、すべてのリクエストに応じてのAccept-Languageヘッダを設定する必要がありました。

関連する問題