JavaScript関数の同期

私は現在、大学の最終年度プロジェクトに取り組んでいます。私は、データベースからデータを取得し、ユーザー入力を使用してデータを操作してグラフを生成するUIを作成しています。JavaScript関数の同期

イベントの順序は次のとおりです。DataCtrlはHTTP getを使用してデータベースからデータを取得します。これにより、データがdataFactoryに格納されます。その後、RadioCtrlは選択のためのユーザー入力を探します。これはuserFactoryに格納されます。

私がしたいのは、dataFactoryのデータとuserFactoryの入力を比較する関数を作成することですが、dataFactoryが定義されていないことを引き続き示します。私は何かの約束/遅れを実装する必要があると理解していますが、私はどちらも使用していません。私はJavascriptをその場で学んでいますので、これをどうやって行うのか、あるいはそれが最善の方法それ。私のコードは以下の通りです。ご質問やアドバイスをいただければ幸いです。

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 : '' 
};  
});

出典

2016-05-06 user3125335

.then（）内のコードは他のすべての後に呼び出されます。比較コードがdataFactory.getData（response.data）より前に実行されている可能性があります。解決策は、dataFactory.getData（response.data）の後で.then（）の内部で比較を開始することです。 –

私はあなたが、あなたのHTMLは次のようになりますあなたのapp.jsに

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

を追加すべきだと思う：

<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>

出典

2016-05-06 10:48:21 oguzhan00

私は既に働いているウェブサイトを持っています。私はちょうどユーザーの入力に関連するコードを表示していました。これは完全に無関係です。 – user3125335

あなたは約束を使用しようとすることができ

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) 
});

出典

2016-05-06 10:50:45 Sapotero

この例のデータとは何ですか？私は同様の例をオンラインで見たことがありますが、私の状況では、比較を行う前にデータベースからデータを取得していますので、私は何を解決しているのか分かりません。同様に、.then関数では、私の直観的な比較をしています。なぜなら、データは確かにそこにあります（未定義ではありません）。 – user3125335

答えて

関連する問題