简体   繁体   中英

How to pass an ember object to handlebars helper

I want to pass an ember object to the handlebars helper, I used the helper as shown below but it is not receiving correct object. It is just printing the name of the object in console see the code below

//ember helper
Ember.Handlebars.registerHelper('act', function (value) {
            console.log(value); //It prints as item.label               
            return value+"1";
        }); 

//template
     {{#each item in content}}
                <li ><a {{bindAttr href="item.link"}}>{{act item.label}}</a></li>
                {{/each}}



 // Ember model which i am using


  App.AllRoutes = [Ember.Object.create({                
            label: "index",
            link:"#/",

        }),
  Ember.Object.create({
            label: "second",                
            link: "#/second",                
        }),

Update Even though srinivasan solution works It doesn't work for problem shown below. registerBoundHelper return the value with script elements. So for It cannot be used inside tags. Any other help ?

//ember helper
Ember.Handlebars.registerBoundHelper('act', function (value) {
            console.log(value); //It prints as item.label 
          if (value == "somevalue"){ return  new Handlebars.SafeString("class='active'"); }

        }); 

//template
     {{#each item in content}}
                <li {{act item.label}} ><a {{bindAttr href="item.link"}}>{{label}}</a></li>
                {{/each}}

I am using Ember.VERSION : 1.0.0-rc.7, Handlebars.VERSION : 1.0.0

Thanks in advance...

I'm not sure I understand your question. You're passing item.label into the helper, but you expect to get the item as an argument? Why not just do {{act item}} ?

Also, why are you trying to emulate the {{#linkTo}} helper that already exists in Ember?

Kindly check the following.

JAVASCRIPT:

App=Em.Application.create({});

App.Router.map(function(){
    this.route('all');
    this.route('index');
    this.route('second');          
});

Ember.Handlebars.registerBoundHelper('act', function (value) {              
        return value+"1";
    }); 

App.IndexRoute=Em.Route.extend({
    redirect:function(){this.transitionTo('all');}
});

App.AllRoute =Em.Route.extend({
    model:function(){
        return  [Ember.Object.create({                
        label: "index",
        link:"#/"
    }),
      Ember.Object.create({
        label: "second",                
        link: "#/second"                
    })];
 }
});

HTML

<script type="text/x-handlebars" >
    {{outlet}}
</script>

<script type="text/x-handlebars" data-template-name="all">
           {{#each item in controller}}
                <li ><a {{bindAttr href="item.link"}}>{{act item.label}}</a></li>
                {{/each}}


</script>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM