2013-12-16 3 views
1

У меня есть приложение ember с моделью под названием users.js с соответствующими контроллерами и маршрутизацией. В моем usersController.js у меня есть функция, которая подсчитывает количество пользователей в системе. Затем я могу отобразить эту фигуру в моем шаблоне users. Тем не менее, я хочу отобразить эту фигуру в моем шаблоне index, это возможно? Как бы я это сделал - сейчас цифра кажется недоступной для использования за пределами моей модели users.Доступ к вычисленным свойствам за пределами их модели в ember.js

Вот мой usersController-

App.UsersController = Ember.ArrayController.extend({ 
    sortProperties: ['name'], 
    sortAscending: true, 

numUsers: function() { 
     return this.get('model.length'); 
    }.property('model.[]') 

}); 

И мой html-

<script type = "text/x-handlebars" id = "index"> 
    <h2>Homepage</h2> 

//This is where I would like the figure to be 

    <h3>There are {{numUsers}} users </h3> 
    </script> 

<script type = "text/x-handlebars" id = "users"> 

<div class="col-md-2"> 
{{#link-to "users.create"}}<button type="button" class="btn btn-default btn-lg"><span class="glyphicon glyphicon-plus"></button> {{/link-to}} 

//This works fine 

<div>Users: {{numUsers}}</div> 
</div> 
<div class="col-md-10"> 

    <ul class="list-group"> 
    {{#each user in controller}} 
    <li class="list-group-item"> 
    {{#link-to "user" user}} 
     {{user.name}} 
    {{/link-to}} 
    </li> 
{{/each}} 

</ul> 

{{outlet}} 
</div> 
</script> 

ответ

1

Вы можете просто загрузить все пользователи в IndexRoute, что-то вроде этого:

App.IndexRoute = Ember.Route.extend({ 
    model: function() { 
    return this.store.find('user'); 
    } 
}); 

И извлечь общая логика, в этом случае количество пользователей, миксин и использование в случае необходимости:

App.UsersCountMixin = Ember.Mixin.create({ 
    numUsers: function() { 
    return this.get('model.length'); 
    }.property('model.[]') 
}); 

App.IndexController = Ember.ArrayController.extend(App.UsersCountMixin, { 
}); 

App.UsersController = Ember.ArrayController.extend(App.UsersCountMixin, { 
    sortProperties: ['name'], 
    sortAscending: true 
}); 

{{numUsers}} Так будет доступен в вашем index шаблоне.

Чтобы разделить логику с более чем одной модели, вам нужно будет создать некоторый псевдоним model свойство, чтобы избежать двусмысленности:

App.IndexRoute = Ember.Route.extend({ 
    model: function() { 
    return Ember.RSVP.hash({ 
     users: this.store.find('user'), 
     subjects: this.store.find('subject'), 
    }) 
    } 
}); 

App.UsersCountMixin = Ember.Mixin.create({ 
    users: Ember.required(), 
    numUsers: function() { 
    return this.get('users.length'); 
    }.property('users.[]') 
}); 

App.SubjectsCountMixin = Ember.Mixin.create({ 
    subjects: Ember.required(), 
    numSubjects: function() { 
    return this.get('subjects.length'); 
    }.property('subjects.[]') 
}); 

App.UsersController = Ember.ArrayController.extend(App.UsersCountMixin, { 
    users: Ember.computed.alias('model'), 
    sortProperties: ['name'], 
    sortAscending: true 
}); 

App.SubjectsController = Ember.ArrayController.extend(App.SubjectsCountMixin, { 
    subjects: Ember.computed.alias('model'), 
    sortProperties: ['name'], 
    sortAscending: true 
}); 

App.IndexController = Ember.ArrayController.extend(App.UsersCountMixin, App.SubjectsCountMixin, {}); 

Конечно, это очень много кода, чтобы просто показать длину данных, так вы можете просто использовать:

<h3>There are {{users.length}} users </h3> 
<h3>There are {{subjects.length}} subjecst </h3> 

Но я думаю, что у вас будут более сложные вычислимые свойства для совместного использования. В этом случае mixins - хороший способ его достижения.

+0

Блестящий, спасибо, если бы я хотел сделать это для более чем одной модели, скажем, для подсчета предметов, как бы выглядел IndexRoute и IndexController? – bookthief

+1

Добро пожаловать. Я обновил ответ, пожалуйста, посмотрите. –

Смежные вопросы