Hi guys, i’m new and like to get some help.
I got two buttons which will execute next and previous function when clicked in the {{if}} statement.
So basically if it is the last page, next button will hide, and previous button will hide in the first page.
But after trying, seems like the view only render once, so the new boolean is not being read, and thus the buttons is not hid even the boolean is false.
And btw how can I call the function in the same controller?
Like calling bgImg in actions.next,
I tried this.send(‘bgImg’); but no luck.
Any help is appreciated.
Codes below:
template.hbs
{{#if notMin}}
<button {{action 'previous'}}></button>
{{/if}}
{{#if notMax}}
<button {{action 'next'}}></button>
{{/if}}
controller.js
App.ApplicationController = Ember.Controller.extend({
frameIndex: 1,
frameSize: 5,
notMin: false,
notMax: true,
actions: {
next: function(){
this.notMin = true;
if(this.frameIndex>=this.frameSize){
console.log("Last page reached!");
}else if(this.frameIndex==this.frameSize-1){
this.frameIndex++;
this.notMax = false;
}else{
this.frameIndex++;
}
},
previous: function(){
this.notMax = true;
if(this.frameIndex==1){
console.log("First page reached!");
}else if(this.frameIndex==2){
this.frameIndex--;
this.notMin = false;
}else{
this.frameIndex--;
}
}
},
bgImg: function(){
var head = "background-image:url('images/";
var img = jsondata[this.frameIndex-1].bgimg;
var end = "')";
return head+img+end;
}.property('frameSize'),
});