Wie man die dynamischen ng-Modellfelder wieder füllt, wenn der Wert von ng-repeat in Angularjs mit dem ionischen Framework

Question

Ich benutze ionic Framework, um eine App zu erstellen. In meiner Form muss ich das dynamische ng-Modell-Eingabefeld neu füllen. Ich verweise "How to create Dynamic ng-model in Angular", um das dynamische ng-Modellfeld zu erstellen. Es klappt. Aber wenn ich versuche, dieses Feld wieder zu füllen, hat es nicht funktioniert (ich muss CRUD-Betrieb durchführen).

Mein HTML-Teil ist:

<div class="row header"> 
    <div class="col col-40">Name</div> 
    <div class="col col-60">Marks</div> 
</div> 

<div class="row" ng-repeat="(key, user) in userList"> 
    <div class="col col-40" ng-bind="user.name"></div> 
    <div class="col col-60"> 
    <input type="text" name="actual_marks" ng-model="markscardData.actual_marks[user.user_id]" placeholder="Please enter the marks" /> 
    </div> 
</div> 

Mein Controller ist wie dieser

.controller('MarkscardAddCtrl', function($scope, $stateParams, $state, $http, $ionicPopup, baseUrl) 
{ 
    $scope.markscardData = {}; 


    $http.get(baseUrl+"api_method=markscard.getUserList&api_version=1.0&app_key=12345& course_id="+course+"&subject_id="+subject+"& markscard_id="+markscard).then(function(response){ 
    $scope.userList = response.data.responseMsg; 
    }); 
}) 

Der Wert JSON in $ scope.userList wie diese

[{"name":"Harshith","user_id":"249","actual_marks":"76","min_marks":"40","max_marks":"100"},{"name":"Nithin","user_id":"246","actual_marks":"60","min_marks":"40","max_marks":"100"},{"name":"Prathik","user_id":"247","actual_marks":"70","min_marks":"40","max_marks":"100"},{"name":"Ravee","user_id":"250","actual_marks":"80","min_marks":"40","max_marks":"100"},{"name":"Shivarama","user_id":"248","actual_marks":"90","min_marks":"40","max_marks":"100"}] 

I markscardData.actual_marks brauchen [user.user_id] wird neu befüllt, wenn das Formular im Bearbeitungsmodus geöffnet ist, und erlaubt auch das Aktualisieren. Bitte helfen Sie mir dabei. Danke im Voraus.

Answer 1

Ich nehme an, Sie verlieren Daten, wenn Sie die Seite neu laden. Dies geschieht, weil die dynamischen ng-Modelle nicht wirklich in Ihrem Controller gebunden sind. Wenn Sie aktuelle Marken aus dem JSON Sie erhalten,

for(var i in userList){ 
    $scope.markscardData.actual_marks[userList[i].user_id] = userList[i].actual_marks; 
} 

setzen Sie diese Zeile unter $scope.userList = response.data.responseMsg; laden möchten. Dies sollte Ihre dynamischen Modelle ggf. initialisieren. Außerdem müssen Sie diese beiden Erklärungen am Anfang setzen: $scope.markscardData = {}; $scope.markscardData.actual_marks = []; Hope this für Sie .. :)

Answer 2

Ich bin nicht wirklich sicher, was Sie Problem so groß wie der Code, den Sie zur Verfügung gestellt haben mit dem Code in der Antwort sollte gut funktionieren:

Angenommen, Sie nur versuchen, die Werte der Felder zu aktualisieren, dann würde ich eine Methode erstellen, die Sie aufrufen können, mit dem Array von Benutzern als Parameter, und Verwechseln Sie dann das Modell, das Sie erstellt haben, markscardData.

this.markscardData = { 
    actual_marks : {} 
} 
this.updateList = function(newList) { 
    angular.forEach(newList, function(user) { 
     if (!user || !user.user_id) return;  
     ctrl.markscardData.actual_marks[user.user_id] = user.actual_marks; 
    }); 
} 

DEMO: https://jsfiddle.net/qvw9bmhe/35/