Wenn Sie eine HTML-Vorlage in das DOM einfügen, klicken Sie auf den sauberen Weg (Eine Instanz einer Klasse erstellen)?

8

In meinem AngularJS-Projekt habe ich so etwas (es ist ein Dropdown-Menü mit Kundennamen. Mit einem Klick auf einen der Namen sollte eine Scrum-Karte mit den Namen des Kunden auf der Karte erscheinen. ):

%Vor%

Ich möchte erreichen, dass bei jedem Klick eine Karte eingefügt wird. Jetzt ist das Problem, dass diese Karte mehrere Zeilen HTML-Code hat. Es wäre also besser, eine ganz neue Vorlage einzufügen. Aber ich kann keine Vorlage mit ng-Klick einfügen, oder? Abgesehen davon ist es ziemlich dreckig, den HTML-Code in eine Variable zu schreiben und in diese Liste zu schieben, oder?

Also habe ich überlegt, eine Kartenklasse in Coffeescript zu erstellen und bei jedem Klick eine Instanz zu erstellen. Was wäre praktisch, um diese Klasse beim Klick mit meiner HTML-Vorlage / teilweise zu erstellen? Wie kann ich Angular mitteilen, eine neue Instanz meiner Klasse Card zu erstellen?

(Vorher habe ich eine Direktive erstellt, die das templateURL-Attribut mit meinem partiellen hatte. Aber das gleiche Problem: Ich möchte meine Direktive auf ng-click und nicht manuell einfügen, indem ich meine Direktive in den Code einfüge ... btw, I bin ein Angular und CoffeeScript Anfänger ...)

Vielen Dank im Voraus!

    
christophe 06.10.2013, 16:06
quelle

1 Antwort

13

Sie sollten meiner Meinung nach zwei Dinge tun. Ich entschuldige mich, dass dies JS und nicht CoffeeScript ist, aber die Absicht ist dieselbe:

  1. Erstellen Sie einen Controller mit einer Funktion, die Sie bei ng-click aufrufen. Vielleicht hast du das schon (da du nicht weißt, wo addCard () definiert ist). Diese Funktion sollte eine Instanz Ihrer Kundenkartenklasse zu einem Array hinzufügen, das an den $ scope gebunden ist.
  2. Wenn das Anzeigen einer dieser Karten ausreichend komplex ist, erstellen Sie eine neue benutzerdefinierte Anweisung zum Anzeigen einer Karte und verwenden Sie sie innerhalb Ihrer ng-Wiederholung.

Beispiel:

%Vor%     
ksimons 06.10.2013, 17:01
quelle