AngularJS服務延遲發送數據

Question

我收到服務中的數據，但我收到的數據爲未定義。我的AngularJS服務返回數據，但我收到未定義。

我的服務代碼：

myApp.service("studentinfo", function ($http) { 
    var studentlist = []; 

    this.GetStudentList = function() { 

    $.getJSON("/Home/GetStudentsList", function (data) { 
     if (data.Result == "OK") { 
     studentlist = data.Data; 
     } 
     else { 
     studentlist = []; 
     } 
    }).complete(function() { 
     return studentlist; 
    }); 
    }; 
}); 

我的控制器代碼：

myApp.controller("studentcontroller", function ($scope, $http, studentinfo) { 
    $scope.StudentList = []; 

    function LoadStudentRecord(){ 
    $scope.StudentList = studentinfo.GetStudentList(); 
    } 

    LoadStudentRecord(); 
}); 

Answer 1

你混合幾件事情在這裏，提到：

1. 你似乎正在使用jQuery（$.getJSON） - 我建議你試着留在角落$http（你注入的方式）。所以嘗試使用$ http.GET（https://docs.angularjs.org/api/ng/service/ $ http）。
2. 請記住，這將返回一個承諾。您可能確實希望從您的服務中返回一個承諾，以便您可以在控制器中決定如何處理失敗的情況。
3. 我建議使用不同的方式來實例化您的服務和控制器，請參閱下面的示例。這允許您稍後縮小您的代碼。

代碼：

var app = angular.module('myapp', []); 
app.service('studentservice', ['$http', function ($http) { 
    getStudentList = function() { 
     return $http.get('/Home/GetStudentsList'); 
    }; 
    return { 
     getStudentList: getStudentList 
    } 
}]); 

app.controller('studentcontroller', ['$scope', 'studentservice', function ($scope, studentservice) { 
    $scope.StudentList = []; 

    function LoadStudentRecord() { 
     $scope.StudentList = studentservice.getStudentList() 
      .success(function (data, status, headers, config) { 
       $scope.StudentList = data; 
     }) 
      .error(function (data, status, headers, config) { 
       console.log(data) 
     }); 
    } 
    LoadStudentRecord(); 
}]); 

Answer 2

我看你注入$ HTTP，但你不使用它。用$ http替換jQuery方法。 $ HTTP將返回一個承諾和控制器，你可以更新任何承諾方法的模型（然後，趕，終於）

Answer 3

function studentFunction ($http) { 
    var studentlist = []; 
    this.GetStudentList = function() { 
    return $http.get("/Home/GetStudentsList"); 
    }; 

} 

myApp.service("studentinfo", studentFunction); 
myApp.controller("studentcontroller", function ($scope, studentinfo) { 

    $scope.StudentList = []; 

    function LoadStudentRecord(){ 
    studentinfo.GetStudentList().then(function (respoonse) { 
    $scope.StudentList = respoonse; 
    }); 
} 

LoadStudentRecord(); 

}）;

該服務應該看起來像這樣。你在你的控制器中使用諾言。