Angular Traduire les balises HTML

Je sais que cela a été demandé ici avant, mais aucune réponse ne semble pas fonctionner pour mon cas

J'ai acheté ce thème Angle qui travaille avec Angulaire 1.4.2 et Angulaire de traduire la version 2.6.0 (encore mis à jour pour la dernière 2.7.2)

Le modèle par défaut est la Traduire module sur elle

C'est le fichier de configuration

  $translateProvider.useStaticFilesLoader({
      prefix : 'app/i18n/',
      suffix : '.json'
  });
  $translateProvider.preferredLanguage('es');
  $translateProvider.useLocalStorage();
  $translateProvider.usePostCompiling(true);
   //Enable escaping of HTML
  $translateProvider.useSanitizeValueStrategy('sanitize'); //I added this line based on Docs wasn't before

Et la traduction des fichiers au format JSON

  {
   "page": {
    "PAGES_WELCOME" : "Welcome to <br> MY APPLICATION, HEY THERE IS A BR TAG BEFORE ME"
  },

  "login": {
    .
    .
    .
    .
  },

Mais je ne peux pas ajouter des balises HTML à l'intérieur du texte, sur le fichier JSON, au lieu de se

Bienvenue
MON APPLICATION

Je suis

Bienvenue < br > MON APPLICATION

Comment puis-je résoudre ce problème?

MODIFIER

Je ne veux PAS supprimer les balises, mon fichier JSON est modifié par le backend, et qu'il peut et va contenir des Balises HTML, je veux ces balises de travailler sur la sortie.

JADE Exemple Où le contenu est la liaison

div(class="col-lg-4 col-md-4 col-sm-4 col-xs-12 footer-left")
  p(class="text-center") 
    {{ 'page.PAGES_WELCOME' | translate }}

source d'informationauteur DannyG

  1. 16

    Angulaire assainit toutes les chaînes html lors de sa interpolation.
    Pour contourner ce problème, vous devrez marquer le HTML de la sécurité dans $sce avant l'injection. Puis également utiliser ngBindHtml à la sortie de la html.

    Je n'ai pas utilisé angular-translate avant, mais cela peut fonctionner:

    //app is the main module
app.filter("htmlSafe", ['$sce', function($sce) {
    return function(htmlCode){
        return $sce.trustAsHtml(htmlCode);
    };
}]);

//then to output it
<span data-ng-bind-html="'page.PAGES_WELCOME' | translate | htmlSafe"></span>
  2. 1

    Mais je ne peux pas ajouter des balises HTML à l'intérieur du texte, sur le fichier JSON, au lieu de se

    Bienvenue sur MON APP

    Je suis

    Bienvenue à

    MON APPLICATION

    Vous avez un <br> qui est la rupture de la chaîne comme vous l'avez dit vous ne voulez pas donc l'enlever de la sorte: 

    {
   "page": {
    "PAGES_WELCOME" : "Welcome to {{appName}}"
  },

  "login": {
    .
    .
    .
    .
  },
  3. 1

    Installer ngSanitize module.

    Il vous donne la possibilité de lier un contenu html, puis modifiez le code comme ceci:

    ng-bind-html="'a_key_with_html' | translate"
  4. 1

    En fait je ne veux vraiment pas à utiliser les balises dans mon template html. Les balises n'est pas significative.

    J'ai enfin réussi à le faire fonctionner. Environnement: Angulaire 1.5.8, angulaires-tranlsate: 2.11.0

    Ma solution est la suivante:
    1. charge ngSanitize et initialisation du module

    1. $translateProvider.useSanitizeValueStrategy('sanitize');

    2. <p ng-bind-html="'Please <strong>refresh</strong> the browser' | translate"></p>

  5. 0

    Testé avec AngularJS 1.4.7, je viens d'utiliser ce:

    <span data-ng-bind-html="'my.i18n.code.to.translate.html.tags' | translate"></span>

    Puisque je ne veux pas d'injecter n'importe quel filtre, mais au-dessus est juste travaillé sur ma propre confiance i18n chaîne. Bien sûr, l'on a accepté la réponse la plus sûre, mais il est juste à travailler immédiatement.