2016-06-15 2 views
1

Anzeige habe ich einen Text wie:ein Textformat, bevor es in AngularJS

Blablabla 
Hello 
How are you? 

Aber es hat in meiner Datenbank in demselben Textfeld wie folgt gespeichert werden:

Blablabla Hello How are you? 

Ich bin Ich möchte Angular verwenden und ich würde gerne wissen, wie man den Datenbanktext formatiert, bevor er in der Vorlage angezeigt wird.

<p>{{ value }}</p> 

Ich weiß, ich sollte einen Separator in der Datenbank hinzufügen, aber ich weiß nicht, ob es möglich ist, ein ‚\ n‘ beispielsweise hinzuzufügen und dann den Text formatieren, bevor sie angezeigt werden.

+0

Stellen Sie sicher, dass die Zeilenumbrüche im Text in der an erster Stelle, und verwenden Sie CSS, um sie zu erhalten: https://developer.mozilla.org/fr/docs/Web/CSS/white-space –

+0

Wie kann ich sicherstellen, dass die Zeilenumbrüche im Text sind? – miquelarranz

+0

Wie bei jeder Benutzereingabe bereinigen Sie es vor dem Senden an die Ansicht – charlietfl

Antwort

1

Versuchen Sie, diese

In Ihrem Controller

$scope.value = $scope.value.replace(/\n/g, '<br/>'); 
$scope.trustedHtml = $sce.trustAsHtml($scope.value); 

Ihrer Ansicht

<p ng-bind-html="trustedHtml"></p> 

ODER

Sie eine Fabrik schaffen, es zu benutzen überall

angular.module('app').filter('trustedHtml', function($sce) { 
    return function(val) { 
     return $sce.trustAsHtml(val); 
    }; 
}); 

In Ihrem Controller

$scope.value = $scope.value.replace(/\n/g, '<br/>'); 

Ihrer Ansicht

<p ng-bind-html="value | trustedHtml"></p> 

LÖSUNG:

<p ng-bind-html="value"></p> 

So Angular $ sanitize löscht die Tags, die wie 'script' böswillig sein kann

+0

Das Problem ist, dass der Text von Benutzern gesendet wird und ich denke, es ist nicht sicher, es mit ng-blind-html anzuzeigen, können sie bösartige Skripts richtig hinzufügen? – miquelarranz

+0

Ja, ich denke schon, aber die Verwendung von ng-bind-html = "trustedHtml" ist möglicherweise unsicher? Ich meine, können die Benutzer Skripte injizieren? – miquelarranz

+0

Okay, ich habe ng-bind-html = "value" anstelle von trustAsHtml verwendet, daher filtert $ size die Tags, die wie Skripts unsicher sein können – miquelarranz

Verwandte Themen