My Backbone Model is fetching data from an API as JSON
the structure is like:
releases
tracks
length
Now I specifically want to the lenght of a track. How do achieve that?
I tried to do
afterRender: function(){
this.model.get('releases.tracks.length');
console.log(track);
}
but that didnt work, gives me 'undefined'
please help
Related
meteor, meteor & angular gurus.
I am really new to angular-meteor and facing the following problem. I perform a search using
$scope.Contacts = $meteor.collection(Contacts,false).subscribe('searchString', $scope.searchString);
or
$scope.Contacts = $scope.$meteorCollection(Contacts,false).subscribe('searchString', $scope.searchString);
and the $scope.Contacts does not refresh. It seems like its holds the old collection (speculation). I can see the data being returned by the mongo server and they look fine.If I iterate through the collection using $meteor.foreach you can see that the data are there.
But once the first search result is assigned to $scope.Contacts it wont refresh any more. I am having the feeling that $scope.Contacts keeps its own "collection" and only append new rows/docs coming from $meteor.collection.
Any help would be greatly appreciated.
Thanks All,
Sotiris
It's kind of weird. From my understanding, subscribe is linking the data pipline, collections is the representative of the data.
$scope.meteorSubscribe('contacts');
$scope.contacts = $scope.$meteorCollection(function (){
Contacts.find({someField: $scope.searchString})
}
You might want something like this?
I want to load JSON data from file and load into a Collection.
Collection:
define(['backbone', 'model'], function(Backbone, Model) {
return Backbone.Collection.extend({
model: Model,
url: 'data/data.json'
});
});
Edit:
The problem now seem to be the data is collected after the render function is executed the first time. So if I comment out the render function and make the template update from the success function, it works, but this is of course not the proper way of doing it. Any better ideas?
this.template(this.coll.toJSON())
will probably solve your problem. Never use the collection itself when forwarding data to template.
If you're using handlebars or mustache, you should event use :
this.template({col : this.coll.toJSON()})
it's usually good practice to not use an array as root element for context.
i am trying to learn backbone.js
trying to get data from php then display it by model, view and route of backbone.js
but its not displaying my data, it displaying [object Object]
you can see output here::
http://php-backbone.gopagoda.com/
and the source code::
https://github.com/foysal-mamun/php-backbone
i have console.log my this.model, you can see my data in::
this.model.attributes.message
please help me how can i fix this.
Thanks.
Change like below in your router.
this.messageModel.fetch({success: function () {
$('#msg').html(this.messageView.render().el);
}}
and change like below in your render function.
$(this.el).html(this.template(this.model.attributes));
I wanted to attach some new calculated property to a complex json object returned from a REST Service. This can be easily achieved through KnockoutJS's Mapping pluggin.
But I have decided to go for AngularJS this time. Is there any modules/pluggins similar to knockout's mapping pluggin ??
my PROBLEM is as shown below:
JSON Returned from server is something like:
{
id:2,
name: 'jhon',
relatives:[
{id:1,name:'linda', score:{A:10,B:33,C:78} },
{id:2,name:'joseph', score:{A:20,B:53,C:68} },
{id:3, name:'keith', score:{A:40,B:83,C:30} }
]
}
in the above json object, I want to attach some calculated property to each objects inside "relatives" collection based on the score each relative has.
Try using
angular.extend($scope, data);
I'm also starting to use Angular, coming from Knockout and Durandal :) Hope this might work for you. The data should be accessible in your view ($scope) directly.
Edit: See this thread.
Basically in angular there is no thing similar to Observable variables.
AngularJS makes observing separately from $scope itself.
To make map from Json in AngularJS you can use angular.fromJson to bind data from Json.
To add fields to your scope you also can use angular.extend.
But anyway adding calculated field is thing that you need to make by yourself, for this purpose you can try to use watch methods: $scope.watch, $scope.watchGroup,
watchCollection.
I am on way to learning backbonejs.
I am working with the popular todo list tutorial.
I have certain questions about which i am a bit confused:
In one the models i found this function:
toggle: function() { this.save({completed: !this.get(’completed’)});}
The thing that i don't understand is this.save function. How does it work? What does it actually saves and where. And what does the code inside this function means: completed: !this.get and so on.
In one of the views i found this line of code:
this.input = this.$(’#new-todo’);
Now what does this.input means? And i also don't understand the sytnax this.$('#new-todo');
Let me know if more code is needed for comprehension. Also if anyone could point me to great learning resources for backbone, it will be awesome. Currently i am learning from 'Backbone Fundamentals' by addyosmani.
Backbone Model and Collection both have url properties.
When set properly backbone will make a HTTP POST request with the model as a payload to the url when saved for the first time (id property has not peen set). I you call save and the models id has been already set, backbone will by default make PUT request to the url. Models fetch function generates a GET request and delete a DELETE request.
This is how backbone is made to work with RESTfull JSON interfaces.
When saving a model you can define the actual model to save like it's done in the example.
Read the Backbone.js documentation. It's ok!
http://backbonejs.org/#View-dollar
this.$('#new-todo') // this.$el.find('#new-todo')
toggle: function() { this.save({completed: !this.get(’completed’)});}
Its basically saving inverse value to "completed" attribute of model. so if model's current attribute is true, it would save it to false !
regarding this.input = this.$(’#new-todo’);
Its basically saving/caching DOM with id "new-todo" from current VIEW's 'el' to view instance's 'input' property. so that we do not have to call jQuery methods for getting the same element when we need in future.
hope this helps.
:)
I too am a backbone newbie and i had been in search of good tutorials that gave good insights into the basics and i found after around 3-4 days of searching. Go through backbonetutorials.com and there is a video compiled which gives exactly what we need to know about Routers, Collections, Views and Models.
The sample working can be found at : http://backbonetutorials.com/videos/beginner/
Although this tutorial is a very basic one, you need to have basic jquery, javascript knowledge. Keep http://www.jquery.com opened in another tab as well when you go through the sample codes. Documentation is extremely useful.
Once you have good knowledge of jquery then if you go through the tutorials, you will understand and pick it up a lot better. And once you get hold of the MV* pattern of backbone you'll love it.
p.s : Do not copy paste codes or functions if you need to learn, type them.!!..
Cheers
Roy
toggle: function() { this.save({completed: !this.get(’completed’)});}
Backbone Model have a url property, when you set a property backbone makes a HTTP request to that url to save that value to the data source.
Here it is setting the value of "completed" attribute with inverse of earlier "completed" value, which will be saved to the data source