nicht angemeldet
AngularJS editable text disable
Hallo,
ich habe folgendes Beispiel:
Was ich machen möchte ist, dass man das Editieren des Textes ausschaulten kann, also wenn man den Text anklickt, dass sich das Editieren- Input- Feld nicht öffnet.
Meine Frage wäre jetzt, wie man das machen kann - ich hab schon einiges probiert, hatte aber keinen Erfolg. Ich arbeite mit AngularJS und ich bin mir nicht sicher, ob man das Attribute "editable-text="user.name"" einfach hinzufügen und entfernen soll (ich wüsste ehrlich gesagt auch nicht, wie ich das machen kann).
Wäre dankbar für jegliche Hilfe in diese Richtung!
Bg Hannes
-
Tach!
Ich arbeite mit AngularJS und ich bin mir nicht sicher, ob man das Attribute "editable-text="user.name"" einfach hinzufügen und entfernen soll (ich wüsste ehrlich gesagt auch nicht, wie ich das machen kann).
Schau dich mal in AngularJS um, wo da Attribute hinzugefügt, entfernt und/oder geändert werden und auf welche Weise es dort gemacht wird.
Fällt dir nichts ein/auf? Wie wäre es zum Beispiel mit ng-class oder ng-readonly oder ng-model (für value)? Die bauen sich da eine eigene Attribut-Direktive. Wenn dir der Angular-Code zu unübersichtlich ist, mit "angular add remove attribute" solltest du auch übersichtlichere Lösungen finden.
Wichtig ist in dem Zusammenhang auch die Dokumentation zum $compile-Service und das Tutorial zu den Direktiven.
dedlfix.
-
Danke für deine Antwort - da bin ich überfordert :-) Ich hab das MVC- Prinzip von angular schon intus aber directiven hab ich noch nicht gemacht :-(. ng-readonly hab ich schon probiert - das hatte keine Auswirkungen.
Ich befürchte, dass ich da noch Hilfe benötige - ich häng seit einem Tag an dem Problem.
DANKE! Hannes
-
Tach!
ng-readonly hab ich schon probiert - das hatte keine Auswirkungen.
Das hatte ich auch nicht unbedingt erwartet. Das war nur ein Beispiel, wie Angular vorgeht, um ein Attribut zu setzen oder löschen.
Ein Attribut wegzunehmen bringt dich aber in dem Fall, denk ich mal, nicht ans Ziel. Du verwendest da eine Bibliothek namens angular-xeditable und das denkt gar nicht daran, mit dem weggenommenen Attribut die Funktionalität zu entfernen. Zumindest brachte das Entfernen mit den Entwicklertools nicht das gewünschte Ergebnis. Vielleicht sieht es anders aus, wenn man das in einem Digest-Zyklus macht. Das herauszufinden ist aber Aufwand, der sich möglicherweise gar nicht lohnt.
Ich hab einen anderen Vorschlag: Dupliziere das Element und entferne bei einem das editable-xxx-Attribut. Gib dem einen ng-show und dem anderen ng-hide nebst deiner Bedingung oder verwende ng-if (beachte die in der Dokumentation aufgeführten Unterschiede). Alternativ kannst du auch je einen Container für das ng-show/hide/if drumherumsetzen.
dedlfix.
-
Ich hab einen anderen Vorschlag: Dupliziere das Element und entferne bei einem das editable-xxx-Attribut. Gib dem einen ng-show und dem anderen ng-hide nebst deiner Bedingung oder verwende ng-if (beachte die in der Dokumentation aufgeführten Unterschiede). Alternativ kannst du auch je einen Container für das ng-show/hide/if drumherumsetzen.
an das hab ich auch schon gedacht, die view ist aber zeitkritisch und ich habe maximal ca. 400 solcher Felder in einer Tabelle. Wenn ich das mit ng-show, ng-hide mache, dann hat ich die ganzen Felder doppelt - das wollte ich unbedingt vermeiden :-(
Dachte nicht, dass das so schwierig ist - ich hab auch keine Ahnung mehr, was/wie ich das machen soll. Vielleicht hast du ja noch eine Idee - ich wäre dir sehr dankbar!!
Bg Hannes
-
Tach!
Dachte nicht, dass das so schwierig ist - ich hab auch keine Ahnung mehr, was/wie ich das machen soll. Vielleicht hast du ja noch eine Idee - ich wäre dir sehr dankbar!!
Die Funktionalität kommt ja mit dem xeditable in dein Spiel. Du kannst entweder diese Komponente erweitern (wirst du nicht bringen, schätze ich mal, und ist auch nicht ganz unaufwendig) oder schauen, ob man da Optionen setzen kann. Sah mir nicht so aus, als ich das überflogen hab.
Eine andere Möglichkeit ist noch, das Klick-Event abzufangen. Wenn du mehrere Click-Eventhandler hinzufügst, ist, soweit ich gelesen habe, nicht definiert, in welcher Reihenfolge die abgearbeitet werden. Demzufolge ist es nicht sicher, dass dein expliziter ng-click-Handler das Event vor dem Click-Handler der xeditable-Direktive bekommt.
Du kannst aber in der Capturing-Phase in einem übergeordneten Element das Click-Event abfangen und als erledigt kennzeichnen. Jedoch kann Angulars ng-click sich nur in Bubble-Events einklinken. Du musst dir da doch wieder was eigenes schreiben - oder kopieren.
dedlfix.
-
-
-
-