Ändern Sie die $ scope-Variable von submit(), die HTTP-Post-Anforderung sendet

Ich kann den Wert für $scope in einer Erfolgsantwort von $http.post Anfrage nicht festlegen. Die Postanforderung wird über die Funktion submit() von einem Formular gesendet, das mit ng-submit="submit()" gesendet wird.

chatApp.controller('createController', ['$scope', '$http', '$location', function($scope, $http, $location) { 
    $scope.fullname; 
    $scope.create = function() { 
     // console.log($scope.email, $scope.password, $scope.firstname, $scope.lastname); 
     $http.post('ajax/createaccount.php', { 
      'email': $scope.email, 
      'username': $scope.username, 
      'password': $scope.password, 
      'firstname': $scope.firstname, 
      'lastname': $scope.lastname 
     }).then(function(data) { 
      console.log("Success"); 
      $scope.fullname = data.config.data.firstname + " " + data.config.data.lastname; 
      console.log($scope.fullname); 
      $location.path("/createsuccess"); 
     }, function() { 
      console.log("Error"); 
     }) 
    } 
    console.log($scope.fullname); 
}]);

Die erste console.log($scope.fullname) gibt die richtigen Daten aus.

Die zweite console.log($scope.fullname) Ausgänge 'undefined'.

Ich schätze jeden, der sich die Zeit nimmt, sich das anzuschauen.

Quelle

2016-07-29 Sorakthun Ly

Die zweite bedeutet eine außerhalb der 'create' Funktion? –

Dies ist sehr einfach. Eine Eine JAX-Anfrage ist eine asynchrone Anfrage, die asynchron ausgeführt wird. Wenn Sie also Ihr Formular mit der Methode $http senden (die Daten mit AJAX auf den Server überträgt), wird der Erfolgsrückruf ausgeführt, nachdem der Server geantwortet hat.

Sie können also nicht erwarten, dass Ihre letzte Anweisung console nach der Übermittlung Ihres Formulars ausgeführt wird.

chatApp.controller('createController', ['$scope', '$http', '$location', function($scope, $http, $location) { 

    console.log("1"); 
    $scope.fullname; 

    $scope.create = function() { 
     console.log("2"); 
     $http.post('ajax/createaccount.php', { 
      'email': $scope.email // your data 
     }).then(function(data) { 
      console.log("3"); 
     }, function() { 
      console.log("Error"); 
     }) 

     console.log("4"); 
    } 

    console.log("5"); 
}]);

Wenn Ihr createController instanziiert wird, werden Sie die Ausgabe 1 und dann 5 zuerst sehen. Und wenn Sie Ihr Formular mit create() Methode senden, dann sehen Sie die Ausgabe 2 ->4 und nach ein paar Sekunden 3.

bearbeiten

Um Ihr Problem tatsächlich zu beheben, die Sie kommentiert, Sie die $rootScope aber mit $rootScope wird nicht empfohlen, verwenden können. So empfehle ich Ihnen einen globalen Controller erstellen und zuweisen, um sie Ihren body Tag wie

<body ng-controller="GlobalController">

Und definieren dort ein Objekt:

chatApp.controller("GlobalController", ["$scope", function($scope) { 

    $scope.globalData = {}; 
}]);

Dies wird einen gemeinsamen Winkel Umfang in Ihrer Anwendung erstellen, so dass Sie Halten Sie gemeinsame & generische Daten. Und jeder untergeordnete Controller (wie in diesem Fall createController) erbt Daten von diesem globalen Controller.

jetzt Ihren createController Code wie folgt ändern:

chatApp.controller('createController', ['$scope', '$http', '$location', function ($scope, $http, $location) { 

    $scope.create = function() { 
     // console.log($scope.email, $scope.password, $scope.firstname, $scope.lastname); 
     $http.post('ajax/createaccount.php', { 
      'email': $scope.email, 
      'username': $scope.username, 
      'password': $scope.password, 
      'firstname': $scope.firstname, 
      'lastname': $scope.lastname 
     }).then(function (data) { 
      console.log("Success"); 
      $scope.globalData.fullname = data.config.data.firstname + " " + data.config.data.lastname; 
      console.log($scope.fullname); 
      $location.path("/createsuccess"); 
     }, function() { 
      console.log("Error"); 
     }) 
    }; 

    console.log($scope.globalData.fullname); 
}]);

Alternativ können Sie ein Angular Service/Werk schaffen können, die gemeinsamen Daten zu halten.

Quelle

2016-07-29 07:17:17

gibt es trotzdem, ich Variable $ scope.fullname nach Wunsch einstellen kann es in einer anderen Seite ($ location.path („/ createsuccess“)) zu verwenden, die die gleiche Steuerung verwendet? –

Thank you so much. es funktioniert super. Obwohl ich fragen könnte, wie ich $ scope.globalData.fullname in der neuen HTML-Seite ausgeben könnte, die ich gerade umgeleitet habe? Es hat den gleichen Controller wie die Weiterleitungsseite, "createController". Zuvor hatte ich {{fullname}} und es warn Ich arbeite nicht, weil die Daten nicht richtig geladen wurden. Ich schätze Ihre Hilfe. –

Es ist einfach: '{{globalData.fullName}}' –

Auf der then Ihrer $http.post versuchen die Aktualisierung folgendermaßen vor:

$scope.fullname = data.config.data.firstname + " " + data.config.data.lastname;

zu (es sei denn, das Datenobjekt explizit data.config.data.firstname/WS kehrt Daten nicht):

$scope.fullname = data.firstname + " " + data.lastname;

Falls dies das Problem nicht löst, versuchen Sie console.log(data);, um die $http.post Antwort der Methode vom Server zu sehen.

Quelle

2016-07-29 07:08:59

Danke für Ihre Antwort. Es funktioniert nicht, als ich es versuchte. Es muss vollständig "data.config.data.firstname" sein, um auf den von der Anfrage zurückgegebenen Wert zuzugreifen. –

Können Sie die console.log (Daten) kommentieren; bekommst du nach der Anfrage? :) –

1. Erfolg, asdf asdf (getestete Werte), undefined –

Ändern Sie die $ scope-Variable von submit(), die HTTP-Post-Anforderung sendet

Antwort

Verwandte Themen