lundi 16 février 2015

Getting "Uncaught TypeError: undefined is not a function" when trying to call get() or set() from an object


I've been working on an ember template which mimics this emberjs tutorial. However, instead of using the same object for properties, I want to specify the "project" object from which this action comes from. These are stored in an array which is accessed by calling model. When I pass the object as a parameter for the specific action, I can log the object and see that it is defined. However, when I try to set or get the properties, I get the error:



Uncaught TypeError: undefined is not a function


You can see the two methods I attempted to use to work around the error, however, each call still causes an error.


Method one:



contract: function(project){
var indx = this.projects.indexOf(project)
console.log(indx);
this.projects[indx].set('isExtended', false);
}


Method two:



contract: function(project){
project.set('isExtended', false);
}


I believe the problem is related to the array stored at model or projects. If anyone has any advice how to remedy this type error, please let me know. Thanks ahead of time and here's all of the relevant code:


The HTML:



<script type="text/x-handlebars" id="projects">
<div class = "row bodeh">
<div class ="col-lg-12">
<h1>Projects</h1>
</div>
{{#each project in model}}
<div {{bind-attr class=project.sass style=project.image}}>
<div class="cont">
<h1><a {{bind-attr href=project.lynk}}>{{project.title}}</a></h1>
<p>{{project.body}}</p>
</div>
{{#if project.isExtended}}
<div class="extraMat">
<button type="button"{{action 'contract' project}}>Contract</button>
<p>{{project.content}}</p>
</div>
{{else}}
<button type="button"{{action 'expand' project}}>Expand</button>
{{/if}}

</div>
{{/each}}
</div>

</script>


EmberJS



App.ProjectsRoute = Ember.Route.extend({
projects: [],
actions: {
expand: function(project) {
console.log(this.projects.indexOf(project));

project.set('isExtended', true);
},
contract: function(project){
var indx = this.projects.indexOf(project)
console.log(indx);
this.projects[indx].set('isExtended', false);
}
},
model: function() {
var objects = [];
//to handle the array less thing with foreach, just add index as a property. Count is also valuable.
var tuna = {
bgurl: "img/tunadbo.jpg",
title: "Tuna",
body: "Tuna is a music discovery application. But is it really? TONIGHT, we investigate. ",
content: "This is the content"
};
var greatest = {
bgurl: "img/great.png",
title: "Greatest",
body: "You best believe",
content: "This is the content"
};
var sus = {
bgurl: "img/combatix.png",
title: "Combatix",
body: "Small video game\n",
content: "This is the content"
}
var trust = {
bgurl: "img/great.png",
title: "The Trustiest of the trust\n",
body: "Ya know",
content: "This is the content"
}
objects.pushObject(tuna);
objects.pushObject(greatest);
objects.pushObject(sus);
objects.pushObject(trust);
for(i = 0; i< objects.length; i++)
{
objects[i].lynk = "http://ift.tt/1AwCSyg";
objects[i].image = "background-image:url('"+objects[i].bgurl+"');";
objects[i].isExtended = true;
objects[i].sass = "col-lg-12 col-sm-12 col-xs-12";
objects[i].sass += " heedthis hvr-fade";
}
this.projects = objects;
return objects;
}
});




Aucun commentaire:

Enregistrer un commentaire