Heim > php教程 > PHP开发 > Hauptteil

Lösung zur Lösung des Konflikts zwischen Angular.Js- und Django-Tags

高洛峰
Freigeben: 2016-12-27 15:13:26
Original
1369 Leute haben es durchsucht

Vorwort

Jeder sollte wissen, dass die Vorlagensysteme von Django und Angular sehr ähnliche Tag-Systeme verwenden. Beispielsweise verwenden beide {{ content }}, um Variablennamen darzustellen. Daher kann es zu Konflikten kommen, wenn Django und Angular zusammen verwendet werden. Ich habe einige Lösungen online gefunden. Jetzt werde ich es mit Ihnen teilen, nachdem ich es zusammengefasst habe. Schauen wir es uns gemeinsam an.

1. Ändern Sie das Standard-Tag von AngularJs

Der folgende Code kann das ursprüngliche Tag von Angular in {[{ content }]} ändern.

Angular-Tags ändern

myModule.config(function($interpolateProvider) {
 $interpolateProvider.startSymbol('{[{');
 $interpolateProvider.endSymbol('}]}');
});
Nach dem Login kopieren

Dies ist eine relativ einfache und intuitive Methode. Der geänderte Code ist einfacher zu lesen und Sie können auf einen Blick erkennen, ob es sich um ein Django-Tag oder ein Angular-Tag handelt. Der Nachteil besteht darin, dass es leicht zu Konflikten mit Plug-Ins von Drittanbietern kommt (wenn das Plug-In von Drittanbietern Anweisungen und andere Tags verwendet).

2. Django anweisen, einen Teil der Vorlage nicht zu rendern

Ab Django 1.5 wird das Tag {% verbatim %} unterstützt (wörtlich bedeutet wörtliche Übersetzung), Django rendert den im wörtlichen Tag eingeschlossenen Inhalt nicht:

{% verbatim %}
 {{if dying}}Still alive.{{/if}}
{% endverbatim %}
Nach dem Login kopieren

Dieses Tag unterstützt keine Verschachtelung, aber Sie können dem Tag einen Namen hinzufügen:

{% verbatim myblock %}
 Avoid template rendering via the {% verbatim %}{% endverbatim %} block.
{% endverbatim myblock %}
Nach dem Login kopieren

Auf diese Weise sucht Django nach dem Endverbatim von myblock als Endmarkierung und das in der Mitte eingefügte Verbatim-Tag wird als verarbeitet uninterpretierter Teil von myblock.

Der Vorteil dieser Lösung besteht darin, dass sie die Komplexität des Codes nicht erhöht, außerdem von Django nativ unterstützt wird und keine Auswirkungen auf Angular hat. Der Nachteil besteht darin, dass an vielen Stellen viele wörtliche Tags verwendet werden können, was die Vorlage sehr unübersichtlich macht.

3. Verwenden Sie Plug-Ins von Drittanbietern

Derzeit ist das mir bekannte Django-Angular. Dieses Plugin bietet die Möglichkeit, Django- und Angular-Tags zu mischen.

Während Sie Angular-Tags korrekt analysieren, können Sie weiterhin Djangos if und andere Tags verwenden.

{% load djng_tags %}
{% angularjs ng %}
<div{% if ng %} ng-repeat="item in items"{% endif %}>
 <h4><a ng-href="{{ item.absolute_url }}"{% if not ng %} href="{{ item.absolute_url }}"{% endif %}>{{ item.name }}</a></h4>
 <img ng-src="{{ item.image.url }}"{% if not ng %} src="{{ item.image.url }}"{% endif %} width="{{ item.image.width }}" height="{{ item.image.height }}" />
 <div{% if ng %} ng-bind-html="item.description"{% endif %}>{% if not ng %}{{ item.description }}{% endif %}</div>
</div>
{% endangularjs %}
Nach dem Login kopieren

Der Nachteil dabei ist, dass die Einführung von Plug-Ins die Komplexität des Codes erhöht. Jeder im Team muss diese Schreibweise erlernen. Ich persönlich bin der Meinung, dass es auch einfacher ist, die Fehlerquote zu erhöhen.

Ich denke, die zweite Methode ist angemessener. Versuchen Sie, das Front-End und das Back-End zu trennen, und die Daten werden an Angular übergeben.

Zusammenfassung

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, dass der Inhalt dieses Artikels für alle beim Lernen oder bei der Arbeit hilfreich sein kann eine Botschaft zum Mitteilen.

Weitere verwandte Artikel zu Lösungen zur Lösung von Tag-Konflikten zwischen Angular.Js und Django finden Sie auf der chinesischen PHP-Website!


Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Empfehlungen
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage