Angular Js 得到 Json 不工作

Question

我正在尝试制作一个简单的 angular 应用程序，它读取 json 数据，但作为响应，我只得到“，”而不是 data.Any 我要去的地方的指针错误的？我附上了我保存在服务器上的 index.html 和 abc.json 文件 PFB代码.

HTML：

<body ng-app="sampleApp" ng-controller="ctrl1">
    Name:<input type="text" ng-model="name">
    <ul>
        <li ng-repeat="student in students | filter:name">{{student.name +","+student.empNo}</li>
    </ul>
    Name:<input type="text" ng-model="newname">
    EmpNo:<input type="text" ng-model="newemp">
    <input type="button" value="AddMe" ng-click="add()"/>
    <div>
        <div ng-view></div>
    </div>

Javascript：

var x=angular.module('sampleApp',[])
.factory("simpleFactory",function($http){
    var factory={};
    factory.getStudents=function(){
        return $http.get("abc.json");
    }
        return factory;
    })
    .controller("ctrl1",function($scope,simpleFactory){
        $scope.students=simpleFactory.getStudents();
        $scope.add=function(){
        $scope.students.push(
            {
            name:$scope.newname,empNo:$scope.newemp
            }       
        )
    }
})

abc.json

[           
  {"name":"jack","empNo":"1"},
  {"name":"Red","empNo":"2"},
  {"name":"Jill","empNo":"3"}
]

Answer 1

getStudents 是异步的。您应该通过回调处理程序检索和分配学生。

  .factory("simpleFactory",function($http){
            var factory={};
            factory.getStudents = $http.get("abc.json");
            return factory;
         })
        .controller("ctrl1",function($scope,simpleFactory){
            simpleFactory.getStudents().then(function(result) {
                  $scope.students= result.data;
            });
            ...            
        })

Answer 2

几乎正确。 getStudents其实returns你一个'Promise'，不是数据本身。您必须使用该 Promise 来获取数据：

simpleFactory.getStudents().then(function(data) {
  $scope.students=data
  // $scope.students=data.data      // you may need this given your feedback
});

Angular Js 得到 Json 不工作

Angular Js get Json not working

json

angularjs