在多语言应用angularJS路由 [英] angularJS routing in multilanguage app

问题描述

我想实现多语言的应用程序。
我需要通过控制器名称前添加两个字母的ISO参数的URL访问请求的语言。
例如：
的http：// APPPATH / EN /家
的http：// APPPATH / FR /家
的http：// APPPATH / AR /家

I'm trying to implement a multilanguage app. i need to access the requested language by adding a two letter iso parameter to the URL before the controller name. for example: http://appPath/en/home http://appPath/fr/home http://appPath/ar/home

 $stateProvider
         .state('home', {
             url: '/home',
             templateUrl: baseTemplateUrl + "home.html",
             controller: 'homeController'
         })
        .state('login', {
            url: '/login',
            templateUrl: baseTemplateUrl + "login.html",
            controller: 'loginController'
        })
      .state('customers', {
          url: '/customers',
          templateUrl: baseTemplateUrl + "customers.html",
          controller: 'customersController'
      })
      .state('signup', {
          url: '/signup',
          templateUrl: baseTemplateUrl + "signup.html",
          controller: 'signupController'
      });

我使用的是基本stateprovider为现在的路由。任何想法如何改变这种让此功能工作吗？

i'm using a basic stateprovider for routing right now. any idea how to change this to get this feature working?

感谢你在前进，

更新

有关的人有同样的问题，我的解决办法是：

For anyone having the same problem, my solution was:

改变每个州以下

 .state('signup', {
              url: '/:lang/signup',
              templateUrl: baseTemplateUrl + "signup.html",
              controller: 'signupController',
              resolve: {
                  lang: ['$stateParams', function ($stateParams) {
                      document.cookie = "lang=" + $stateParams.lang;
                  }]
              }
          });

我保存$ stateParams LANG的值到一个cookie，因此您可以通过app.run（访问），并把它传递给我的translationService因为$ stateParams未初始化尚未有。

i save the value of the $stateParams lang into a cookie so you can access it through the app.run() and pass it to my translationService since the $stateParams is not initialized yet there.

这样你的应用程序将只与html5mode = FALSE工作。这意味着你总会看到一个丑陋的＃标签的网址（的http：//路径/＃/ {语言} / { controllername} andto解决这个问题，我配置了$ locationProvider是这样的：

this way your app will work only with html5mode=false. which means you will always see an ugly hashtag in the URL (http://path/#/{lang}/{controllername} andto solve this, i configured the $locationProvider this way:

 $locationProvider.html5Mode(true).hashPrefix('!');

和你的index.html文件这一行的标签内插入设置站点的基础URL：

and set the base url of the site by inserting inside the tag of your index.html file this line:

 <base href="/">

感谢

推荐答案

添加语言code作为一个URL参数

Add the language code as a url parameter

$stateProvider
     .state('home', {
         url: '/:langcode/home',
         templateUrl: baseTemplateUrl + "home.html",
         controller: 'homeController'
     });

和在你的控制器，使用get 郎code 值 $ stateParams

And in your controller, get langcode value using $stateParams

$scope.language = $stateParams.langcode;

这篇关于在多语言应用angularJS路由的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！