AngularJS：加載異步翻譯問題

我正在用AngularJS構建網站。我遇到了翻譯問題，得到了或多或少的解決方案，但我認爲它可以做得更好。AngularJS：加載異步翻譯問題

我有一個主控制器，它從數據庫加載翻譯。

$http.get($rootScope.ApiUrl + '/?a=sprache&lang=' + $rootScope.lang).success(function (data) { 
     $scope.spr = data; 
     $rootScope.translations = data; 
     $rootScope.updateTranslations(); 
    });

數據是格式化的一個這樣的數組：

{key: "translation",…}

此外在I具有用於每個狀態的控制器。我希望它可以做這樣的事情：因爲這個代碼之前調用的GET請求還沒有完成，因此$ rootscope.translations變量沒有設置

app.controller('InventoryCtrl', [ 
'$scope', 
'$http', 
'$location', 
'$state', 
'$stateParams', 
'$rootScope', 
'$uibModalStack', 
function ($scope, $http, $location, $state, $stateParams, $rootScope, $uibModalStack) { 
    $scope.title = $rootscope.translations.myTranslatedTitleForThisState 
]);

顯然，這是行不通的。

而是我寫了下面的內容。在成功完成獲取請求後，updateTranslations（）函數在MainController（上面）中的loadTransition（）函數中調用。

app.controller('InventoryCtrl', [ 
'$scope', 
'$http', 
'$location', 
'$state', 
'$stateParams', 
'$rootScope', 
'$uibModalStack', 
function ($scope, $http, $location, $state, $stateParams, $rootScope, $uibModalStack) { 
    $rootScope.updateTranslations = function() { 
     $rootScope.setMetaTags($rootScope.translations.inventory_title, $rootScope.translations.inventory_description); 
     $rootScope.updateTranslations(); 
    } 
    } 
]);

我很確定這可以做得更好。有任何想法嗎？

來源

2016-07-27 user3916916

也許這個答案是不直接回答你的問題，而是一個可能的新途徑......

我們一直在使用ui-router很多相當近角項目。 ui-router非常適合在應用程序中定義路線。關於該主題的更多信息here。

一個很好的功能是狀態resolvement。意味着國家只有在解決承諾得到解決時才能解決。

例如

angular.module('testApp').config(function($stateProvider) { 
    $stateProvider.state('', { 
     url: '/', 
     templateUrl: 'main.html', 
     resolve: { 
      labels: function(labelService) { 
       return labelService.loadLabels(); 
      } 
     } 
    }); 
});

在上面的例子中，狀態/將解決loadService.loadLabels()背後的$http.get承諾解決後。在解決所有解決方案後，意味着將加載模板。

在這種情況下，您的視圖將被加載 - 之後，所有的標籤都將被控制器加載並訪問（稍後的視圖）。

一件好事是nested state definitions是完全可能的。意思是說，你可以擁有1個根狀態，以及許多根狀態的子狀態。

來源

2016-07-27 21:21:45

AngularJS：加載異步翻譯問題

回答

相關問題