數據未顯示

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