Javascript 使用angularjs在html中加载异步解析数据_Javascript_Html_Angularjs_Parse Platform_Javascript Databinding

Javascript 使用angularjs在html中加载异步解析数据

javascript html angularjs parse-platform

Javascript 使用angularjs在html中加载异步解析数据,javascript,html,angularjs,parse-platform,javascript-databinding,Javascript,Html,Angularjs,Parse Platform,Javascript Databinding,我正在尝试一个快速测试来调试为什么我的一些代码不能按预期工作我有一个名为testCtrl的控制器和一个名为myService的服务。在这个服务中，我试图从Parse中获取数据，一旦获得了数据，我就试图将这些数据加载到我的前端html中代码如下： app.controller('testCtrl', function($scope,myService) { var currentUser = Parse.User.current(); $scope.username = currentUse

我正在尝试一个快速测试来调试为什么我的一些代码不能按预期工作

我有一个名为

testCtrl

的控制器和一个名为

myService

的服务。在这个服务中，我试图从Parse中获取数据，一旦获得了数据，我就试图将这些数据加载到我的前端html中

代码如下：

app.controller('testCtrl', function($scope,myService) {
var currentUser = Parse.User.current();

$scope.username = currentUser.getUsername();
$scope.test = "ths";
var promise1 = myService.getEvaluatorData();
promise1.then(function(response){
    $scope.results2 = response;
    console.log(response);
    });
});

app.factory('myService', function(){
 return {
   getAllData: function($scope){
      getEvaluatorData($scope);
   },

   getEvaluatorData: function(){

       var evaluators = Parse.Object.extend("Evaluators");
       query = new Parse.Query(evaluators);

       return query.find({
          success: function(results){
            angular.forEach(results, function(res){

                console.log("Looped"); //this is just to verify that the then call below is executed only after all array objects are looped over.
            });

          } ,
          error: function(error){

          }
       });
   }
  }
});

下面是我要显示数据的html代码：

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body ng-controller="testCtrl">
{{test}}

{{results2}}
</body>
</html>

您需要

从服务中返回数据并将其传递给控制器。例如：
app.controller('testCtrl', function ($scope, myService) {
    var currentUser = Parse.User.current();
    $scope.username = currentUser.getUsername();
    $scope.test = "this";
    myService.getEvaluatorData().then(function (response) {
        console.log('response', response);
        $scope.results2 = response;
    });
});

app.factory('myService', function ($http, $q) {
    return {
        getEvaluatorData: function () {
            var evaluators = Parse.Object.extend("Evaluators");
            var query = new Parse.Query(evaluators);

            return query.find({
                success: function (results) {
                    return results;
                },
                error: function (error) {
                   return error;
                }
            });
        }
    }
});

而且，在我看来，调用this.getEvaluatorData（$scope）
也没有意义，当您可以直接调用getEvaluatorData
方法时，请使用$rootScope.result2而不是$scope.result2
我想您完全弄糟了。您应该使用angular路由器或指令-这取决于目的。@PawełSmołka对不起，我是angularjs的初学者，请详细说明一下？非常感谢！如果需要自定义视图，请使用ng视图。如果要将自定义计算相关内容使用指令，可以与factory功能混合使用。您在AngularAPI参考中获得了指令描述。如果你读了这篇文章，你会找到你的解决方案。今天我忙于照顾我的新生儿，没时间再写了：/@PawełSmołka谢谢你的帮助。你肯定有一些线索给我。我会调查的。再次感谢！下面是我如何使用Parse Hope it Helps的一个示例，因此您可能希望首先初始化一个空数组，例如：$scope.results2=[]
app.controller('testCtrl', function ($scope, myService) {
    var currentUser = Parse.User.current();
    $scope.username = currentUser.getUsername();
    $scope.test = "this";
    myService.getEvaluatorData().then(function (response) {
        console.log('response', response);
        $scope.results2 = response;
    });
});

app.factory('myService', function ($http, $q) {
    return {
        getEvaluatorData: function () {
            var evaluators = Parse.Object.extend("Evaluators");
            var query = new Parse.Query(evaluators);

            return query.find({
                success: function (results) {
                    return results;
                },
                error: function (error) {
                   return error;
                }
            });
        }
    }
});