Display last object from dynamically updating array + emberjs + handlebars


#1

I am using rails 4 with emberjs. I have an array of users that I get from the server. I need to display the last object on the UI. Also, the user can add new users to the array but only the last/latest-added user should be visible.

My ember version details are as

Ember      : 1.7.0-beta.1
Ember Data : 1.0.0-beta.8.2a68c63a
Handlebars : 1.3.0
jQuery     : 1.11.1

My current handlebars code is as. After adding the new user to users array, the new user details is displayed.

{{each users}}
  //display all the users here.
{{/each}}

What i want is something like this

{{#each users}}
  {{#if @last}} 
    //display user details
  {{/if}}
{{/each}}

I tried adding a property in the associated controller and removed the ‘each’ loop. I displayed the lastUser details which works. But if I add a new user, the UI still displays the previous user details.

lastUser: (->                                                                                                                             
  return @model.users.get('lastObject')
).property('@model.users')

How can this be acheived? Thanks.


#2

The array you are watch is always staying the same as its a JS object, but the content gets updated. you can do this by changing it to one of these.

.property(’@model.users.[]’) or .property(’@model.users.@each’) or .property(’@model.users.length’)

and in your handlebars just use it like following. I guess the property is on the controller:

{{#each users}}
  {{#if lastUser}} 
    {{lastUser}}   
 {{/if}}
{{/each}}