JSON to HTML with breaklines, angular-translate

Question

I'm using Angular-translate and I am trying to load a text from JSON with breakline, but the html is not recognizing.

JSON:

"ABOUT": {
    "headline":"Every day\n every moment",
    "span": "Be Like"
}

ANGULARJS:

.config(function($translateProvider) {

// Sanitize
$translateProvider.useSanitizeValueStrategy('escaped');

// Load  JSON
$translateProvider.useStaticFilesLoader({
    prefix: '/app/languages/app-',
    suffix: '.json'
});
$translateProvider.preferredLanguage('en');

HTML:

        <h2> <span>{{ 'ABOUT.span' | translate }}</span>
        {{ 'ABOUT.headline' | translate }}
       ....

Is there some way to do that?

Moe Shaaban · Accepted Answer · 2015-05-24 12:13:11Z

4

Use white-space:pre; in css so it would be like that in your html

<h2 style="white-space:pre;"> <span>{{ 'ABOUT.span' | translate }}</span>{{ 'ABOUT.headline' | translate }} </h2>

here is a plunker http://plnkr.co/edit/Bjs6LC9Z9Fy1v5ULqlVW?p=preview

answered May 24, 2015 at 12:13

Moe Shaaban

1746 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

JSON to HTML with breaklines, angular-translate

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related