如何编写一个angularJs控制器来从Parse.com获取Rest数据 [英] How to write an angularJs Controller to GET Rest Data from Parse.com
问题描述
请参阅下面的解决方案:
我正在尝试连接到Parse.com Rest后端并显示来自对象值的数据。
I'm trying to connect to a Parse.com Rest backend and display data from object values.
HTML(我放了几个角度调用以确保捕获输出):
HTML (I put several angular calls to be sure to catch output):
<div ng-controller="MyController">
<p>{{item}}<p>
<p>{{items}}<p>
<p>{{item.firstName}}<p>
<p>{{data}}<p>
</div>
JAVASCRIPT休息:
JAVASCRIPT rest:
function MyController($scope, $http) {
$scope.items = [];
$scope.getItems = function() {
$http({method : 'GET',url : 'https://api.parse.com/1/classes/Professional/id', headers: { 'X-Parse-Application-Id':'XXXX', 'X-Parse-REST-API-Key':'YYYY'}})
.success(function(data, status) {
$scope.items = data;
})
.error(function(data, status) {
alert("Error");
});
};
}
这不起作用,它什么都不做,甚至没有留言控制台。
我知道其余的调用获得了正确的凭证,因为当我使用其他测试程序测试它时,我能够获得对象内容。也许URL不应该是绝对的?
任何线索都非常受欢迎,我花了DAYS。
This won't work, it does strictly nothing, not even a message in the console. I know the rest call got the correct credential, as I'm able to get object content returned when I test it with a rest tester program. Maybe the URL should not be absolute ? Any clue is very welcome, i've spent DAYS on that.
解决方案:
感谢在回答这个帖子的人的帮助下,我找到了解决这个问题的方法,所以我只想回馈:
Thanks to the help of people answering this thread, I was able to find the solution to this problem so I just wanted to contribute back:
从Parse.com后端获取Json对象数据,传递它的身份验证参数:
Get Json object data from Parse.com backend, pass it authentification parameters:
function MyController($scope, $http) {
$scope.items = [];
$scope.getItems = function() {
$http({method : 'GET',url : 'https://api.parse.com/1/classes/Professional', headers: { 'X-Parse-Application-Id':'XXX', 'X-Parse-REST-API-Key':'YYY'}})
.success(function(data, status) {
$scope.items = data;
})
.error(function(data, status) {
alert("Error");
});
};
请注意''必需的arround标头密钥对象值。方法和网址密钥不需要那些'。
Notice that ' ' necessary arround header key object values. Those ' ' are not necessary around method and url keys.
列出每个对象的所有'firstName'的模板:
Template that list all 'firstName' of each object:
<div ng-controller="MyController" ng-init="getItems()">
<ul>
<li ng-repeat="item in items.results"> {{item.firstName}} </li>
</ul>
</div>
注意:item.results中的项目。 results是必需的,因为返回值是一个JSON对象,它包含一个带有列出对象的JSON数组的结果字段。这可以为你节省一些头痛。
另请注意ng-init:如果你没有把它或任何其他形式的调用放到getItem(),那么什么都不会发生,你将不会返回任何错误。
Notice: "item in items.results". "results" is necessary because the return value is a JSON object that contains a results field with a JSON array that lists the objects. This could save you some headache. Also notice "ng-init": if you don't put that, or any other form of call to the getItem(),then nothing will happen and you will be returned no error.
这是我第一次尝试Angularjs,我已经恋爱了^^。
That was my first try of Angularjs, and i'm already in love ^^.
推荐答案
根据您的要求,控制器应为:
Based in your request the controller should be:
HTML
<div ng-controller="MyController">
<button type="button" ng-click="getItems()">Get Items</button>
<ul>
<li ng-repeat="item in items"> item.firstName </li>
</ul>
</div>
JS
function MyController($scope, $http) {
$scope.items = []
$scope.getItems = function() {
$http({method : 'GET',url : 'https://api.parse.com/1/classes/Users', headers: { 'X-Parse-Application-Id':'XXXXXXXXXXXXX', 'X-Parse-REST-API-Key':'YYYYYYYYYYYYY'}})
.success(function(data, status) {
$scope.items = data;
})
.error(function(data, status) {
alert("Error");
})
}
}
这篇关于如何编写一个angularJs控制器来从Parse.com获取Rest数据的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!