2017-09-20 3 views
0

Ich muss eine Direktive schreiben, die eine Schaltfläche zu einem Eingabefeld hinzufügen könnte und einige andere Funktionen. So , im Idealfall möchte ich etwas haben, wie dieseWie fügt man mit der AngularJS-Anweisung eine Schaltfläche zu einem Eingabefeld hinzu?

<input type="text" my-directive> 

am Ende wird

<input type="text"><button ng-click="someAction()" ng-class="{'success': isSuccess()}" ng-disabled="isDisabled()">click me</button> 

Vereinfachte Code für meine Richtlinie:

app.directive('myDirective', ['$q', '$timeout', function ($q, $timeout) { 
        return { 
        restrict: 'A', 
        template: '<button ng-click="someAction()" ng-class="{\'success\': isSuccess()}" ng-disabled="isDisabled()">click me</button>', 

        require: '?ngModel', 
        link: function (scope, element, attrs, ctrl) { 

         scope.isSuccess = function() { 
          ... 
         }; 

         scope.isPending = function() { 
          ... 
         }; 
         scope.someAction = function() { 
          ... 
         }; 


....}]); 

Das Problem ist, dass, wenn ich hinzufügen, diese Knopf in der Vorlage der Richtlinie Ich am Ende mit <input><button></button></input>

Eine Anweisung zu erstellen, die auch ein Eingabefeld enthält, ist für mich leider keine Option. Bitte lassen Sie mich wissen, wenn ich mehr Informationen zur Verfügung stellen muss.

+0

Gibt es ein Problem mit dem 'input' und dem' button' Element mit einem Eltern-Dummy-Element? Ich meine ein Element mit Direktive wie '' kann den Inhalt einfach einfügen! –

+0

Leider haben die vorhandenen Eingabefelder alle unterschiedliche Attribute und werden in der gesamten Anwendung verwendet, weshalb ich nicht für alle dasselbe Eingabefeld erzeugen kann – Nat

Antwort

0

Nach einigem Suchen habe ich eine Lösung gefunden. Sie können ein Element hinzufügen, indem Sie es in der Verknüpfungsfunktion Ihrer Anweisung kompilieren und an das Element anhängen.

Verwandte Themen