If statements with variables


#1

Hi everyone,

I was trying to use an “if” statement in my handlebars template as this:

{{#if project.isMember(user) }}

But it seems impossible to use a callable inside if statements. I don’t really understand the reason for this since all the “business” related logic when I do this is already on my domain models. It seems to me that this “isMember” function absolutely belongs on the project object in that case.

Instead it seems that every time I have a condition to check that involves more than just one object, I would have to define a new helper that only just checks this one condition. So now I have to define the condition logic on my model, create a new helper etc… that’s gonna be a lot of new “if-blah” helpers as the app grows…

But hey, still let’s try it…

Ember.Handlebars.registerHelper('if-member', function(project, user){
    if(project.isMember(user)) {
        return options.fn(this);
    }

    return options.inverse(this);
});

That’s how I think it should work. Not so much… here “project” and “user”, the arguments, are just strings. Not the objects that I want to deal with.

A bit of research on the internet got me to the fact that I can use

Ember.Handlebars.registerHelper('if-member', function(project, user){
    if(this.get('model').isMember(user)) {
        return options.fn(this);
    }

    return options.inverse(this);
});

Now with “this.get(‘model’)” since the project is the controller’s model, I can get the model. The user … once again, not so much.

My route is setup like this:

App.ProjectRoute = Ember.Route.extend({
    model: function(params) {
        return this.store.find('project', params.id);
    },
    setupController: function(controller, model) {
        controller.set('content', model);
        controller.set('project', model);
        controller.set('allusers', store.find('user'));
    }
});

So that in my controller I can access the list of ALL users in the app, and then I just want to display them a bit differently if they are a member of the current project. Which means in my template I do the following:

{{#each user in allusers}}
    <tr>
        <td>
            {{#iff isMember user}}
                YES!!!
            {{/iff}}
        </td>
    </tr>
{{/each}}

Then, accessing inside the helper something like

this.get('user');

returns me only “undefined”.

So… how do I use handlebars for non-trivial if statements here???


#2

This would probably be an appropriate calculated property to include on your controller. Since this is occurring in your {{#each}} loop, you’ll want something like:

{{#each user in allusers itemController="projectUser"}}
  <tr>
    <td>
      {{#if isMember}}YES!!!{{/if}}
    </td>
  </tr>
{{/each}}

Then, you’d include the named controller:

App.ProjectUserController = Ember.ObjectController.extend({
  isMember : function() {
    return project.isMember(this.get('content'));
  }.property('content')
});

#3

Where does project come from in the second code snippet?


#4

Totally left that out. Could be something like:

App.ProjectController = Ember.ObjectController.extend({
  isMember : function(user) {
    // Logic to determine if a user is a member
    return true;
  }
});

App.ProjectUserController = Ember.ObjectController.extend({
  isMember : function() {
    return this.get('parentController').isMember(this.get('content'));
  }.property('content')
});

#5

Thanks, that seems to do the trick. Still got no idea what path I should look at for the property to update correctly. This is all very very confusing…