Mit Winkel Richtlinie in raw html innerhalb jquery

Question

Ich bin die Schaffung html nach ajax Antwort zu erhalten, zum Beispiel:

var html = ''; 
html = '<div ng-click="deleteRecord($event)">delete</delete>'; 
$('.main).append(html); 

Aber ng-click Richtlinie funktioniert nicht, wo, wie es funktioniert, wenn in HTML-Dokument direkt hinzugefügt. Ich habe nicht viel Verständnis dafür, wie eckig mit DOM bindet.

Also brauche ich etwas Unterstützung für das Verständnis, wenn ich das schaffen kann, wenn ich html durch jquery hinzufügen?

Danke.

Answer 1

Anstatt den HTML-Code an Ihr Element anzuhängen, können Sie die bindHtml-Direktive verwenden, die in den Standard-Angular-Bibliotheken enthalten ist.

<div data-ng-bind-html="someHtml"></div> 

Wenden Sie einfach den HTML-String an die someHtml Eigenschaft der Steuerung und es sollte funktionieren. Stellen Sie sicher, dass ngSanitize (oder "$ sanitize") in Ihrem Controller enthalten ist, da dies sicherstellt, dass kein schädliches HTML eingefügt werden kann.

Answer 2

Sie können $apply() nach dem Einfügen Ihres HTML aufrufen. Dies zwingt eckig, die Bindungen erneut zu verdauen.

var html = ''; 
html = '<div ng-click="deleteRecord($event)">delete</delete>'; 
$('.main).append(html); 
$scope.$apply(); 

Answer 3

Try this:

$('.main').append($compile(html)($scope)); 
$scope.$apply(); 

Hoffe, es hilft.

PD: Ich würde versuchen, jQuery zu vermeiden, wenn Sie Angular verwenden.