J'ai des problèmes avec le service de traduction fourni par Django dans les partiels AngularJS. Il semble que Django traduise le contenu à l'intérieur d'une partie seulement la première fois que mon site web est chargé. A partir de maintenant, je fournis index.html avec Django, puis charge chaque vue avec la directive ng-view. Le django et le routage angulaire fonctionnent bien. Dans mon dossier de modèles Django j'ai this structure. Chacun de ces fichiers est juste un modèle html régulier avec du contenu en cours de traduction par Django.Traitement de la traduction Django à l'intérieur des partiels AngularJS (ng-view)
Mon 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),
)
Et dans mon angulaire app.js:
$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: '/'
});
Ma structure index.html ressemble à ceci:
<!-- 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>
Et l'un des modèles, par exemple page-home.html ressemble à ceci:
<!-- page-home.html -->
{% load static %}
{% load i18n %}
<!-- more content -->
<h2>{% trans "Goodbye World" %}</h2>
Je travaille actuellement avec 3 langues (anglais, espagnol et Deutsche). Si je charge localhost:8000, Django redirigera automatiquement vers localhost:8000/es/#/, étant donné que l'espagnol est ma langue de navigateur par défaut. Tout le contenu sera bien rendu, donc DOM ressemble à ceci:
<!-- [...] -->
<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>
<!-- [...] -->
Voici où les choses deviennent difficiles. Si je vais à localhost:8000/de/#/ ou localhost:8000/en/#/, juste le contenu directement dans index.html sera traduit dans la langue actuelle, tandis que le contenu à l'intérieur ng-view restera le même. Donc, si je change de Deutsche mon DOM va rendre comme ceci:
<!-- [...] -->
<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>
<!-- [...] -->
Devinez quoi, si je change la langue du navigateur à Deutsche, alors tout le contenu sera rendu à Deutsche mais si je visite localhost:8000/en/#/ ou localhost:8000/es/#/, seule la le contenu en dehors de ng-view va changer. Je ne comprends pas ce qui se passe ici. Comment puis-je modifier la langue à l'intérieur de la vue ng en fonction de la langue de l'URL, et non de la langue du navigateur?