Angular-translate在控制器中不起作用

时间:2017-07-07 15:10:12

标签: angularjs angular-translate

我在Angular JS中遇到问题, 我想将我的网站翻译成英文 所以,要做到这一点,我正在使用翻译模块如下: 在我的 app.js 中,我这样做了:

    var app = angular.module("user",["ui.router","pascalprecht.translate"]);
    app.config(function($stateProvider,$urlRouterProvider) {
    .....
    },
    function( $translateProvider )

{

     $translateProvider.useSanitizeValueStrategy('null');
     $translateProvider.registerAvailableLanguageKeys(['en', 'frZZZ'], {
         'en_*': 'en',
         'fr_*': 'fr'
          })
          $translateprovider.fallbacklanguage('en');

    $translateProvider.translation("en", {
        compose_dishes: 'COMPOSE YOUR DISHES ACCORDING TO YOUR DESIRES',
        adapt_foods: 'Adapt Foods and Quantities'
    });
    $translateProvider.translation("fr", {
        compose_dishes: 'COMPOSEZ VOS PLATS SELON VOS ENVIES',
        adapt_foods: 'Maîtrisez les Aliments et les Quantités'
    });
    $translateProvider.preferredLanguage('en');
})

现在我想在我的控制器中使用它,这是在另一个js文件(home.js)中, 在这里我已经注入了我的$ translate composent:

    ///////le controller home/////
    var app = angular.module("user");


    app.controller( "homeCtrl", function($scope,$http,$state,$rootScope, $compile, $translate, $filter ) {
.....
}

在我看来,我正在尝试翻译在app.js中声明的“compose_dishes”单词,并将其放在h1标记中:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" name="viewport" content="width=device-width, initial-scale=1">
<title>Insert title here</title>

<link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700|Roboto:300,400,500,700" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous" />

    <link href="css/scrolling-nav.css" rel="stylesheet">
    <link href="css/home.css" rel="stylesheet">
</head>
<body ng-app="user" ng-controller="homeCtrl"  id="page-top" data-spy="scroll" data-target=".navbar-fixed-top">



<!-- Intro Section -->
<section id="intro" class="intro-section">
......

<h1 translate="compose_dishes"></h1>

......

</section>

但结果如下图所示:

click here to see the picture

它只显示该单词的等效键,当我放置任何未定义的东西时,它也显示它,这意味着控制器不知道app.js中存在已定义的键。

请帮助我:'(

0 个答案:

没有答案