Javascript Funktion Synchronisation

Ich arbeite derzeit an einem Abschlussjahr Projekt für die Hochschule. Ich mache eine UI, die Daten aus der Datenbank abruft und dann die Daten mithilfe von Benutzereingaben manipuliert, um ein Diagramm zu generieren.Javascript Funktion Synchronisation

Die Reihenfolge der Ereignisse ist: DataCtrl verwendet HTTP get, um Daten aus der Datenbank abzurufen. Dies speichert dann die Daten in einer DataFactory. Dann sucht RadioCtrl nach Benutzereingaben für die Auswahl. Dies wird dann in der userFactory gespeichert.

Was ich tun möchte, ist eine Funktion zum Vergleichen der Daten aus der DataFactory mit der Eingabe aus der userFactory erstellen, aber es kommt immer wieder, dass die DataFactory nicht definiert ist. Ich verstehe, dass ich eine Art Versprechen/Verzögerung implementieren muss, aber ich habe es auch nie benutzt, und ich lerne Javascript im laufenden Betrieb, so dass ich mir nicht sicher bin, wie ich das machen soll oder ob es der beste Weg ist es. Mein Code ist unten, irgendwelche Fragen oder Ratschläge würden sehr geschätzt werden.

app.factory('dataFactory', function() { 
var data = []; 
var ids = []; 
var areas = []; 
var speakers = []; 
var nonSpeakers = []; 
var notStated = []; 
var highestEd = []; 
var gender = []; 
var labourPop = []; 

//Array of functions for data 
var dataService = {}; 

dataService.getData = function(response) { 
    data.push(response); 
    response.forEach(function(element){ 
     ids.push(element.id); 
     areas.push(element.area); 
     labourPop.push(element.labourPop); 
     speakers.push(element.irishSpeakers); 
     nonSpeakers.push(element.nonIrishSpeakers); 
     notStated.push(element.notStated); 
     highestEd.push(element.highestEd); 
     gender.push(element.gender); 
    }) 
}; 

dataService.list = function(){ 
    return data; 
} 
return dataService; 
}); 

app.factory('userFactory', function(){ 
var education; 
var gender; 
var location; 
var graph; 
//Add user input functions here 
var userService = { 
}; 

userService.filter = function(dataFactory) { 

    dataFactory.ids.forEach(function(element){ 
     if(education ===dataFactory.highestEd[element]) 
      graph.push(dataFactory.data[element]); 
    }) 

    console.log(dataFactory.ids); 
}; 

return userService; 
}); 

app.controller('GraphCtrl', function(dataFactory, userFactory){ 
userFactory.filter(dataFactory); 
}); 

app.controller ('DataCtrl', function(dataFactory, $http) { 
$http.get("http://localhost:6698/ngdemo/rest/users") 
.then(function(response) { 
    dataFactory.getData(response.data); 
}) 
}); 

app.controller('RadioCtrl', function(userFactory) { 
userFactory.education = { 
    education : '' 
}; 
userFactory.gender = { 
    gender : '' 
}; 
userFactory.location = { 
     location : '' 
};  
});

Quelle

2016-05-06 user3125335

Code innerhalb einer .then() wird nach allem anderen aufgerufen. Es kann sein, dass Ihr Vergleichscode vor dataFactory.getData (response.data) ausgeführt wird. Die Lösung wäre, den Vergleich innerhalb von .then() nach dataFactory.getData (response.data) zu starten. –

ich glaube, Sie

var app = angular.module('myApp', []);

auf Ihre app.js dann sollten Sie Ihre html wie folgt aussehen sollte hinzufügen:

<html ng-app="myApp"> 

    <head> 
    <meta charset="utf-8" /> 
    <title>AngularJS </title> 

    <link rel="stylesheet" href="style.css" /> 
    <script data-require="[email protected]" src="https://code.angularjs.org/1.3.20/angular.js" data-semver="1.3.20"></script> 
    <script src="app.js"></script> 
    </head> 

    <body ng-controller="DataCtrl"> 

    </body> 


</html>

Quelle

2016-05-06 10:48:21 oguzhan00

Ich habe bereits eine funktionierende Website. Ich habe gerade den Code angezeigt, der für die Benutzereingabe relevant ist. Dies ist völlig unabhängig. – user3125335

Sie können versuchen, verwenden Versprechen

var compare = new Promise(function(resolve, reject){ 
    // here goes synchronous code 

    if (/* compare string */) { 
    resolve(data); 
    } else { 
    reject(error); 
    } 
}); 

compare.then(function(data){ 
    /* do something with data */ 
}).catch(function(error){ 
    throw new Error(error) 
});

Quelle

2016-05-06 10:50:45 Sapotero

Was sind Daten in diesem Beispiel? Ich habe ähnliche Beispiele online gesehen, aber in meiner Situation habe ich die Daten aus der Datenbank abgerufen, bevor ich den Vergleich gemacht habe, also weiß ich nicht, was ich vorhabe. In ähnlicher Weise würde ich in der .then-Funktion meinen Vergleich intuitiv durchführen, weil die Daten definitiv da sind (und nicht undefiniert). – user3125335

Antwort

Verwandte Themen