angularJS Comment puis-je ignorer certaines balises HTML?

J'ai eu cette erreur parce que l'un des utilisateurs a ajouté à son poste <3

Erreur: [$désinfecter:badparse] Le désinfectant n'a pas pu analyser le bloc suivant de html: <3

J'ai écrit un code qui ng-bind-html ="Detail.details"

Je veux lui être prises qu' <a> tag et tag <br />

Est-ce possible?

Merci!

I <3 de ces rapports de bug.

OriginalL'auteur Rafael Smith | 2014-03-20

  1. 11

    Vous pouvez créer un filtre qui va désinfecter votre html.

    Je l'ai utilisé en fonction strip_tags
    http://phpjs.org/functions/strip_tags/

    angular.module('filters', []).factory('truncate', function () {
    return function strip_tags(input, allowed) {
      allowed = (((allowed || '') + '')
        .toLowerCase()
        .match(/<[a-z][a-z0-9]*>/g) || [])
        .join(''); //making sure the allowed arg is a string containing only tags in lowercase (<a><b><c>)
      var tags = /<\/?([a-z][a-z0-9]*)\b[^>]*>/gi,
        commentsAndPhpTags = /<!--[\s\S]*?-->|<\?(?:php)?[\s\S]*?\?>/gi;
      return input.replace(commentsAndPhpTags, '')
        .replace(tags, function($0, $1) {
          return allowed.indexOf('<' + $1.toLowerCase() + '>') > -1 ? $0 : '';
        });
    }
});

    contrôleur:

    angular.module('myApp', ['filters'])
.controller('IndexController', ['$scope', 'truncate', '$sce', function($scope, truncate, $sce){
  $scope.text="";

  $scope.$watch('text', function(){
    $scope.sanitized = $sce.trustAsHtml(truncate($scope.text, '<a><br>'));
  });
}]);

    vue:

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

    http://plnkr.co/edit/qOuvpSMvooC6jR0HxCNT?p=preview

    Ça fonctionne, Merci!!!!!!
    Si cela fonctionne, upvote...
    est ti possible de ne pas remplacer mal de balises, mais les afficher? Exemple, dans votre plunker, insteand de ne pas avoir <b> balises, juste l'affichage des <b>Gras aseptisé</b>?

    OriginalL'auteur Goodnickoff

  2. 7

    J'ai eu le même problème et résolu en utilisant $sce.trustAsHtml, voir ce

    $scope.body = $sce.trustAsHtml(htmlBody);

//In html
<div ng-bind-html="body">body</div>

    Il résoudre le problème

    Je pense que c'est une mauvaise idée. Vous êtes alors en contournant le ngSanitize contrôles de sécurité. Donc, vous pouvez ouvrir l'application à des attaques par injection HTML.
    Ecoute, je ne suis pas à l'aide de ng-bind-html-unsafe qui est depricated, vous ne pouvez pas utiliser ng-bind-html sans ngSanitize. Donc, il n'y a pas de problème de sécurité.

    OriginalL'auteur Ali Adravi

  3. 3

    À préserver l'existant ng-bind-html comportement sans se planter, vous pouvez prendre le $sanitize:badparse exception.

    La ngBindHtml composant utilise en interne la ngSanitize service. Injecter $sanitize dans votre contrôleur et de l'attraper.

    L'avantage de ce rapport à la $sce.trustAsHtml méthodes est que $sanitize ne pas introduire d'éventuelles failles de sécurité (par exemple. javascript injection).

    Contrôleur (injection $sanitize):

    $scope.clean = function (string) {
    $scope.clean = function(string) {
        try {
            return $sanitize(string);
        } catch(e) {
            return;
        }
    };
};

    Cette méthode pourrait être améliorée avec un cache de la dernière valeur.

    Vue:

    <div ng-bind-html="clean(body)"></div>

    OriginalL'auteur Glenn Murrary