多语言应用程序中的Angular JS路由无法正常工作

Question

我正在尝试实现一个多语言应用程序。我需要通过在控制器名称之前的URL中添加一个双字母iso参数来访问所请求的语言。例如：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进行路由。任何想法如何更改此功能以使此功能工作？

先感谢您，

---

UPDATE

---

对于任何有同样问题的人，我的解决方案是：

将每个州改为以下

 .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尚未初始化。

这样你的应用程序只能用于html5mode = false。这意味着你总是会在URL中看到一个丑陋的主题标签（http://path/#/ {lang} / {controllername}并解决这个问题，我用这种方式配置了$ locationProvider：

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

并通过在index.html文件的标记内插入以下行来设置网站的基本网址：

 <base href="/">

谢谢

Answer 1

将语言代码添加为url参数

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

在你的控制器中，使用langcode获取$stateParams值

$scope.language = $stateParams.langcode;