mirror of
https://github.com/Hopiu/angular.js.git
synced 2026-03-17 15:40:22 +00:00
63 lines
2.4 KiB
Text
63 lines
2.4 KiB
Text
@workInProgress
|
|
@ngdoc overview
|
|
@name Cookbook: Resources - Buzz
|
|
@description
|
|
|
|
External resources are URLs that provide JSON data, which are then rendered with the help of
|
|
templates. angular has a resource factory that can be used to give names to the URLs and then
|
|
attach behavior to them. For example you can use the
|
|
{@link http://code.google.com/apis/buzz/v1/getting_started.html#background-operations| Google Buzz API}
|
|
to retrieve Buzz activity and comments.
|
|
|
|
<doc:example>
|
|
<doc:source>
|
|
<script>
|
|
BuzzController.$inject = ['$resource'];
|
|
function BuzzController($resource){
|
|
this.Activity = $resource(
|
|
'https://www.googleapis.com/buzz/v1/activities/:userId/:visibility/:activityId/:comments',
|
|
{alt:'json', callback:'JSON_CALLBACK'},
|
|
{ get: {method:'JSON', params:{visibility:'@self'}},
|
|
replies: {method:'JSON', params:{visibility:'@self', comments:'@comments'}}
|
|
});
|
|
}
|
|
BuzzController.prototype = {
|
|
fetch: function(){
|
|
this.activities = this.Activity.get({userId:this.userId});
|
|
},
|
|
expandReplies: function(activity) {
|
|
activity.replies =
|
|
this.Activity.replies({userId:this.userId, activityId:activity.id});
|
|
}
|
|
};
|
|
</script>
|
|
<div ng:controller="BuzzController">
|
|
<input name="userId" value="googlebuzz"/>
|
|
<button ng:click="fetch()">fetch</button>
|
|
<hr/>
|
|
<div class="buzz" ng:repeat="item in activities.data.items">
|
|
<h1 style="font-size: 15px;">
|
|
<img src="{{item.actor.thumbnailUrl}}" style="max-height:30px;max-width:30px;"/>
|
|
<a href="{{item.actor.profileUrl}}">{{item.actor.name}}</a>
|
|
<a href="" ng:click="expandReplies(item)" style="float: right;">
|
|
Expand replies: {{item.links.replies[0].count}}
|
|
</a>
|
|
</h1>
|
|
{{item.object.content | html}}
|
|
<div class="reply" ng:repeat="reply in item.replies.data.items" style="margin-left: 20px;">
|
|
<img src="{{reply.actor.thumbnailUrl}}" style="max-height:30px;max-width:30px;"/>
|
|
<a href="{{reply.actor.profileUrl}}">{{reply.actor.name}}</a>:
|
|
{{reply.content | html}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</doc:source>
|
|
<doc:scenario>
|
|
it('fetch buzz and expand', function(){
|
|
element(':button:contains(fetch)').click();
|
|
expect(repeater('div.buzz').count()).toBeGreaterThan(0);
|
|
element('.buzz a:contains(Expand replies):first').click();
|
|
expect(repeater('div.reply').count()).toBeGreaterThan(0);
|
|
});
|
|
</doc:scenario>
|
|
</doc:example>
|