Angulaire-Traduire ne fonctionne pas dans un bouton qui a un autre composant

Question

Angulaire-Traduire fonctionne bien pour plusieurs P, H's et étiquettes à l'aide du format

<p translate>something</p>

c'est génial. Mais je ne peux pas le faire fonctionner sur des boutons qui possèdent un autre composant angulaire sur ce bouton, spécifiquement des déposées angulaires. En fait, lorsque je mets traduire à la fin de la>, il enfreint la page complète de la page de la page et aucun ne fonctionne JavaScript. Dans la console, je reçois une erreur: [$ Compiler: multidir] http://errors.angularjs.org/ 1.2.20 / $ Compiler / multidir (etc., etc.)

Le HTML est

<div id="leftOfMap" class="floatingSection" data-ng-controller="languageController">
    <ul>
        <li class="leftOfMapItem"><button id="languageButton" dropdown-menu="ddMenuOptions" dropdown-model="ddMenuSelected" class="btn-menu">Language</button></li>
        <li class="leftOfMapItem" translate>BIKE PATHS</li>
    </ul>
</div>

Le contrôleur angulaire pour ce bouton est

residenceApp.controller('languageController', [ '$scope', 'changeLanguage',
function( $scope, changeLanguage ) {
var languageChoices = [
    {"text": "English", "val": "en"},
    {"text": "Espanol", "val": "es"}
];
$scope.ddMenuOptions = languageChoices;
$scope.ddMenuSelected = {};
$scope.$watch('ddMenuSelected', function(newVal) {
    if (newVal && newVal.text) {
        changeLanguage(newVal.val); //eg., changeLanguage(es);
        //changeLanguage() is the name of a factory service
    }
}, true);
}]);

Le bouton déroulant fonctionne, sélectionne les langues et la traduction se produisent. myApp a la configuration de choses qui se trouve dans les docs de traduction angulaire - $ traductionProvider.Translations () type de choses. Encore une fois, le problème est que lorsque l'attribut / l'instruction TRADUCTE se trouve sur le bouton, il casse la page entière de la page de la page. J'ai essayé d'apporter $ traduire dans le contrôleur ci-dessus, mais je ne pouvais pas le faire fonctionner. Qu'est-ce qui doit changer?

Answer 1

Utilisez-vous une version plus ancienne de la traduction angulaire que la version actuelle sur GitHub?Parce que sinon, ce n'est pas la bonne syntaxe pour cela.Utilisez l'une des opérations suivantes:

<li class="leftOfMapItem" translate="BIKE PATHS"></li>

ou:

<li class="leftOfMapItem">{{ 'BIKE PATHS' | translate }}</li>

Notez les citations autour de la clé de traduction de l'expression.