数据未显示

Question

页

对我有这样的代码在我stucontrollers.j

/// <reference path="../angular.js" /> 
var stucontrollers = angular.module("stucontrollers", []); 
stucontrollers.controller("GetStudentsList", 
    function GetStudentsList($scope, $http) { 
    $http({ 
     method: 'GET', 
     url: '/api/students' 
    }).then(function(data) { 
     $scope.students = data; 
    }); 
}); 

，并在我的view，我有这个

<div ng-app="StudentApp"> 
    <div ng-controller="GetStudentsList"> 
     <table> 
      <thead> 
       <tr> 
        <th>Id</th> 
        <th>FistName</th> 
        <th>LastName</th> 
        <th>Age</th> 
        <th>Gender </th> 
       </tr> 
      </thead> 
      <tbody> 
       <tr ng-repeat="item in students"> 
        <td>{{item.Id}}</td> 
        <td>{{item.FirstName}}</td> 
        <td>{{item.LastName}}</td> 
        <td>{{item.Age}}</td> 
        <td>{{item.Gender}}</td> 
       </tr> 
      </tbody> 
     </table> 
    </div> 
</div> 

，在我app.js这个是什么我有

/// <reference path="../angular.js" /> 
var module = angular.module("StudentApp", ["stucontrollers"]); 

这是在我的StudentsController.cs

// GET: api/Students 
     public IQueryable<Student> GetStudents() 
     { 
      return db.Students; 
     } 

我试图让学生进入我的观点的列表，但我只能得到它在页面检查器中未在网页上显示的响应。我究竟做错了什么。谢谢。

编辑 现在我能够在控制台中看到我的数据。但我仍然无法在我的页面中看到它。以下是我在控制台中获得的数据。

data 
: 
Array(2) 
0 
: 
{Id: 1, FirstName: "Juan", LastName: "Dela Cruz", Age: 25, Gender: "Male"} 
1 
: 
{Id: 2, FirstName: "Maria ", LastName: "Makiling", Age: 30, Gender: "Female"} 

Answer 1

尝试设定值以后调用$scope.$apply()。

$http({ 
     method: 'GET', 
     url: '/api/students' 
    }).then(function(data) { 
     $scope.students = data; 
     $scope.$apply(); 
    }); 

或简单地

$http({ 
     method: 'GET', 
     url: '/api/students' 
    }).then(function(data) { 
     $scope.$apply(function() { 
     $scope.students = data; 
     }); 
    }); 

从$apply documentation

$申请（）是用来从AngularJS框架之外执行在AngularJS的表达式。

Answer 2

试试这个：

/// <reference path="../angular.js" /> 
    var stucontrollers = angular.module("stucontrollers", []); 
    stucontrollers.controller("GetStudentsList", 
    function GetStudentsList($scope, $http) { 
    $http({ 
     method: 'GET', 
     url: '/api/students' 
    }).then(function(response) { 
     $scope.students = response.data; 
    }); 
}); 

Answer 3

要调试这个问题，尝试直接设置的$ scope.students值，就像这样：

/// <reference path="../angular.js" /> 
var stucontrollers = angular.module("stucontrollers", []); 
stucontrollers.controller("GetStudentsList", 
    function GetStudentsList($scope, $http) { 
    $scope.students = [{Id: 1, FirstName: "John"}]; 
}); 

接着是被一两件事情发生：

a）你在列表中看到John：这意味着ng-controller和ng-repeat的工作。提取数据时出现问题。试着通过console.logging你的回应。

b）您在列表中看不到约翰：在请求发生之前甚至出现问题。

Answer 4

这为我工作，你不妨试试：

/// <reference path="../angular.js" /> 
var stucontrollers = angular.module("stucontrollers", []); 
stucontrollers.controller("GetStudentsList", 
    function GetStudentsList($scope, $http,$rootScope) { 
    $http({ 
     method: 'GET', 
     url: '/api/students' 
    }).then(function(data) { 
    $rootScope.$apply(function(){ 
     $scope.students = data; 
    }); 
    }); 
});