2016-04-20 12 views
-1

ich die Werte von Textboxen über eine Ajax-Anforderung wie dies in meinem Controller gesetzt:AnjularJS erhalten Wert von Textboxen nach Tastendruck

$http({method: 'GET', url: url}).success(function(data) { 
       $scope.valzz = data; 
       $scope.company = $scope.valzz[0].Company; 

      }); 

Da ist in meinem html:

<label class="item item-input item-stacked-label"> 
      <span class="input-label">Company :</span> 
      <input type="text" placeholder="Company" value="" ng-model="company"> 
      </label> 

<button class="button button-positive" style="margin-top:10px;" ng-click="saveChanges()"> 
    Save Changes 
</button> 

Damit liegt richtig die Firmenname in der Firmen-Textbox. Wenn Sie jedoch eine Änderung an dieser Textbox vornehmen und auf die Schaltfläche zum Speichern drücken, wird der neue Wert der Textbox nicht angezeigt - sie erhält immer noch das Original. Dies ist auf die Schaltfläche klicken in der Steuerung:

$scope.saveChanges=function(){ 

      alert($scope.company); 

    }; 

Warum ist $scope.company nicht der neue Wert der Textbox? mache ich etwas falsch? (Sorry, wenn Grund ich bin neu zu eckig)

+0

Versuchen vorbei Unternehmen spezialisiert auf die savechanges Funktion – sebenalern

+0

Es ist eine Form mit 30 oder so Felder, brauche ich wirklich an alle weitergeben? –

+0

nvm haha ​​Könntest du mehr Code hinzufügen, damit ich einen Blick darauf werfen kann? – sebenalern

Antwort

2

Versuchen value=""

HTML entfernen:

<label class="item item-input item-stacked-label"> 
    <span class="input-label">Company :</span> 
    <input type="text" placeholder="Company" ng-model="company"> 
</label> 

<button class="button button-positive" style="margin-top:10px;" ng-click="saveChanges()"> 
    Save Changes 
</button> 

In entsprechenden Controller:

$scope.saveChanges = function() { 
    alert($scope.company); 
}; 
+0

Immer noch nicht der neue Wert :( –

+1

Kannst du eine haben grundlegende Geige, damit ich es dort debuggen kann? – softvar

0

Sie haben noch einen Beobachter für das Modell.

$scope.$watch('company', function(company) { 
    console.log(company); 
} 

Oder in Ihrer Vorlage, können Sie den Wert interpolieren:

{{company}} 

Und dann können Sie sich auf der HTML-Seite zu ändern sehen, weil Winkel einen Watcher für sie hinter den Kulissen machen

0

benötigt Umfang this.company nicht $

0

Bitte definieren $ scope.company zu setzen, bevor http $

01 anrufen

Weil, sobald die Teiltöne gerendert hat, es nur die definierten Eigenschaften in $scope erhält. Wenn danach eine Eigenschaft in $ scope hinzugefügt wird, muss sie $apply aufrufen.

Ich hoffe, dies kann Ihnen helfen.

0

Ich würde davon ausgehen, dass Sie $ Scope ordnungsgemäß funktioniert, und dass Sie den Controller in Ihrer App initialisiert haben, sowie mit der richtigen Controller-Datei verknüpft. Bitte vergleiche deinen Code mit dem, was ich hier habe, da dies richtig funktioniert.

HTML:

<html> 
    <head> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script> 
    <script src ="controller.js"></script> 
    </head> 
<body> 

<div ng-app="myApp" ng-controller="testController"> 
<form> 
    <label class="item item-input item-stacked-label"> 
       <span class="input-label">Company :</span> 
       <input type="text" placeholder="Company" ng-model="company"> 
       </label> 

    <button class="button button-positive" style="margin-top:10px;" ng-click="saveChanges()"> 
     Save Changes 
    </button> 
</form> 
</div> 
</body> 
</html> 

Controller:

(function(){ 
    'use strict'; 
    var app = angular.module('myApp', []); 
    app.controller('testController', [ '$scope', function ($scope){ 

      $scope.saveChanges=function(){ 
       alert($scope.company); 
      }; 

     }]); 

})(); 

Edit: Fiddle