如何使用 angularjs 以表格格式显示 parse.com 的查询结果

How to display the query results from parse.com in table format using angularjs

本文关键字:com parse 查询 结果 显示 格式 何使用 angularjs 表格      更新时间:2023-09-26
     /*student.html*/
     <!DOCTYPE html>
     <html ng-app="">
    <head>
  <link rel="stylesheet"     href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">

  <link rel="stylesheet"  href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap-theme.min.css">

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js">    </script>
 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
 <script src="http://www.parsecdn.com/js/parse-1.2.12.min.js"></script>
 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
 <script src= "students.js"></script>
</head>
<body >
  <div class="container" ng-controller="userController">
  <h3>Students</h3>
   <table class="table table-striped">
  <thead><tr>
<th>Edit</th>
<th>First Name</th>
<th>Last Name</th>
<th>Age</th>
</tr></thead>
  <tbody><tr ng-repeat="user in users">
  <td>
  <button class="btn" ng-click="editUser(user.id)">
  <span class="glyphicon glyphicon-pencil"></span>&nbsp;&nbsp;Edit
  </button>
</td>
<td>{{ user.firstname}}</td>
<td>{{ user.lastname }}</td>
<td>{{ user.age }}</td>
   </tr></tbody>
 </table>
<hr>
 </div>
</body>
  </html>

请帮助我,我是 angularjs 的新手,也是第一次使用解析。我在angularjs中使用ng-repeat显示查询结果(这是一个对象数组(时遇到了困难。遇到相同问题的任何人,请提供您的答案。

/*stduents.js*/
function userController($scope) {
var users=[];
Parse.initialize("parseid", "jskey");//parseid and jskey are given in my parse.com account
var student=Parse.Object.extend("student");//student is a class in parse.com
var query=new Parse.Query(student);
query.equalTo("userid",Parse.User.current());
query.find({
success:function(results) {
alert("success");
for(var i=0;i<results.length;i++)
{
 var object= results[i];
users.push({'firstname':object.get('firstname') , 'lastname':object.get('lastname') ,'age':object.get('age')});
}
},
 error:function(error) {
 alert("error:"+ error.code +" "+error.message);
 }
});

ng-repeat的简单用法:

样本数组

var arr = [
    {id: 1},
    {id: 2},
    {id: 3}
]

示例用法

<span ng-repeat="obj in arr">{{obj.id}}</span>

这会给你

123

小提琴

我建议阅读文档。

只需将学生中的第三行更正.js$scope.users=[];