CODEWITHSUNDEEP
javascriptember.jscomponents
stijn.aerts
stijn.aerts

Reputation: 6206

set variable in template file from routes file

I have this code in my index.hbs file:

<button {{action 'showHotspots'}} class="btn btn-success padding">{{hotspotCategory.name}}</button>

I have the showHotspots method in my routes/index.js file:

showHotspots: function( selection ) {
  this.toggleProperty( 'idFromButton' );
}

The method should toggle this part in my routes/index.js:

{{#if idFromButton}}
  <p>Test1</p>
{{/if}}

However this is not working, when I do it as a component it works but I need the Test1 on a specific place on my page (below all the generated buttons). When I do it in components the Test1 gets displayed between the buttons.

Instead of working with a component I want to do this in my index.js file so I can control the structure of the page.

In short: on my index.hbs i have a if-statement that checks if a variable is true. I want to set this variable from my routes/index.js file (or from somewhere else, doesn't matter really) using a method that is called in either the same index.hbs file or from a component-1.hbs file.

Upvotes: 0

Views: 58

Answers (2)

stijn.aerts
stijn.aerts

Reputation: 6206

The (simple) solution was:

this.controller.toggleProperty( 'idFromButton' );

Upvotes: 0

Shayan
Shayan

Reputation: 966

if i understand the question , you using component, you should use method "showHotspots" on the actions of your component, if not you should use this method on the actions of your controller.
it's better to describe more about your question.
edit: if you using old version of ember js, this is an example

//#### controller index.js
App.IndexController = Ember.Controller.extend({
    idFromButton: false,
    actions: {
        showHotspots: function( selection ) {
            this.toggleProperty( 'idFromButton' );
        }
    }
});


//#### index.hbs  (your index controller template)
<button {{action 'showHotspots'}} class="btn btn-success padding">some text</button>
{{#if idFromButton}}
  <p>Test1</p>
{{/if}}

Upvotes: 1

Related Questions