Wie gebe ich einen HTML-Code als Ausgabe des Filters in Angular zurück js

Question

Ich habe einen benutzerdefinierten Filter geschrieben, der einem Muster entspricht, und wenn die Übereinstimmung wahr ist konvertiert es in HTML, wie binde ich die HTML-Ausgabe innerhalb {{test | toimgsrc}} Ich möchte nicht ng-bind-html oder $ sce verwenden, gibt es einen anderen Weg? hier ist mein Code

angular.module('demoApp', ['toimage']) 
 
    .controller('MainController', function($scope) { 
 
    $scope.test = '*!dsfsdfsdfsdfsdfsd!*'; 
 
    }); 
 
angular.module('toimage', []).filter('toimgsrc', function() { 
 
    return function(text) { 
 
    regex = /^\*!(\w*)!\*$/; 
 
    if (regex.test(text)) 
 
     return text.replace(/^\*!(\w*)!\*$/, '<h2 class="bolder">"$1" </h2>') 
 
    else 
 
     return text; 
 
    } 
 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-rc.0/angular.js"></script> 
 
<div ng-app="demoApp" ng-controller="MainController as mainCtrl"> 
 
    {{test | toimgsrc}} 
 
    <div>

Answer 1

Als Winkel Dokumentation sagen:

https://docs.angularjs.org/api/ng/service/$sce

standardmäßig Angular nur Vorlagen aus der gleichen Domäne und Protokoll wie die Anwendung Dokument laden . Dies geschieht durch Aufruf von $ sce.getTrustedResourceUrl für die Vorlagen-URL. Um Vorlagen aus anderen Domänen und/oder Protokollen zu laden, können Sie diese entweder auf die weiße Liste setzen oder sie in einen vertrauenswürdigen Wert einbetten.

, das bedeutet, dass Sie den Wert html konvertieren, die auch sicher sein müssen, dass ist der Grund, den einzigen Weg, das ist mit $ sce wie dieses Problem zu lösen:

$scope.trustedHtml = $sce.trustAsHtml(yourGeneratedHtml); 


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

Der Hauptgrund für die Für die Sicherheitspolitik ist dieser Winkel griffig.