2017-06-12 2 views
0

I Modell node:Wie wird die Direktive für die Modelleingabe verwendet?

{"id":"593d408cb25f42a812000042","prefix":"array_simple", 
"title":"Array_simple","type":"3","value":["A","B","C"],"nodes":[]} 

In dieser obejct gibt es Feldwert mit dem Wert als Array:

"value":["A","B","C"] 

Wie Richtlinie verwenden Eingänge für jeweils Werte im Array anzuzeigen und zu binden, dies zu Modell zurück nach Änderungen?

Ich versuchte Richtlinie zu schreiben:

.directive('inputArray', function ($compile) { 
    return { 
     restrict: 'E', 
     scope: { 
      data: "=" 
     }, 

     link: { 
      pre: function (scope, element) { 

       scope.inputs = []; 

       if (angular.isArray(scope.data.value)) { 
        angular.forEach(scope.data.value, function (value) { 
         scope.inputs.push({"type": scope.data.type, "value": value}); 
        }); 

       } else { 
        scope.inputs.push({"type": scope.data.type, "value": scope.data.value}); 
       } 
      } 
     }, 
     template: `<input ng-repeat="value in inputs track by $index" 
        ng-model="node.value" 
        ng-hide="value.type=='2' || value.type=='6'" 
        type="text" value="$$value.value$$">`, 
     replace: true 
    } 
}) 

Aber es Modell nicht nach Änderungen ändern zurück.

Antwort

0

Bevor Sie versuchen, eine Richtlinie umzusetzen, bekommen etwas Arbeit mit nur Schablone und Controller:

<script src="//unpkg.com/angular/angular.js"></script> 
 
    <body ng-app> 
 
    <div ng-init='data = {"id":"593d408cb25f42a812000042","prefix":"array_simple", 
 
"title":"Array_simple","type":"3","value":["A","B","C"],"nodes":[]}'> 
 
    </div> 
 

 
    <div ng-repeat="item in data.value track by $index"> 
 
     <input ng-model="data.value[$index]" type="text" /> 
 
    </div> 
 

 
    <p>{{data}}</p> 
 
    <p>{{data.value}}</p> 
 
    </body>

Anstatt das Kopieren von Daten auf ein neues Datenmodell, das Datenmodell $index mit direkt verwenden und property accessor bracket notation, data.value[$index].

Verwandte Themen