Pass ‚dieses‘ Objekt auf einen Winkelfilter

Question

Angenommen, ich habe folgendes svg Element

<svg> 
    <text ng-bind-html="input | filter:arg" >this is a txt<text> 
</svg> 

Ich mag die Filter verwenden, um dieses text Element zu aktualisieren und mehr <tspan>, um es hinzuzufügen. Um dies zu tun, muss ich this an meinen Filter übergeben, so dass es an die Elemente mit Javascript anfügt. Wie erreiche ich das? Wie geht man this element zu einem Winkelfilter?

Answer 1

Ich denke, ein besserer Ansatz ist ein Attribut Typ directive

In Ihrem Fall verwenden Sie so etwas wie dieses

<svg> 
    <text custom-bind-html="{{input}}" filter="{{args}}">this is a txt<text> 
</svg> 

Auf diese Weise schreiben konnte man sowohl die input und args Modelle über die attrs zugreifen und das Element während der Richtlinie.

myApp.directive('customBindHtml', function ($sce) { 
    'use strict'; 
    return { 
    restrict: 'A', 
    scope: {}, 
    link: function (scope, element, attrs) { 
     function applyFilter(input, filter) { 
      // modify your input with filter and return it trusted by $sce 
      return $sce.trustAsHtml(input); 
     } 
     var output = applyFilter(attrs.customBindHtml, attrs.filter); 
     angular.element(element).html(output); 
    } 
    }; 
}); 

$sce Anbieter können Sie den Inhalt sichern Vertrauensrichtlinie Fehler zu vermeiden (standardmäßig aktiviert)

JSFiddle example