Вложенный в Ember массив моделей с помощью {{each}} помощника повторно отображает весь список при добавлении в хранилище данных Ember

У меня есть маршрут, который загружает приборную панель

// routes/dashboard/index.js
...
  model: function(params) {
    return this.store.find('dashboard', params.dashboard_id);
  }
...

Модель информационной панели содержит отношение hasMany к модели виджета.

// models/dashboard.js
...
DS.Model.extend({
  widgets: hasMany('widget', {async: true})
...

Модель виджета содержит отношение принадлежность к модели приборной панели.

// models/widget.js
...
DS.Model.extend({
  dashboard: belongsTo('dashboard', {async: true})
...

Шаблон dashboard.index отображает виджеты с помощью помощника {{each}}

// templates/dashboard/index.js
...
{{#each model.widgets as |widget|}}
  {{widget config="widget"}}
{{/each}}
...

Пользователь может добавить виджет на свою панель инструментов

// routes/dashboard/index.js
...
actions: {
  addWidget: function() {
    this.store.createRecord('widget', {
      dashboard: this.modelFor('dashboard.index')
      ...
    });
  }
}

Хотя это работает, когда создается новый виджет, ВСЕ виджеты перерисовываются.

Некоторые вещи, на которые следует обратить внимание: - Я не реализовал View или Controller. - Если я изменю реализацию, чтобы она возвращала только коллекцию виджетов, в результате чего ember-cli создает ArrayController, а не ObjectController, каждый цикл не выполняет повторную визуализацию (отлично). Однако на инструментальных панелях имеется более одного дочернего массива, который необходимо визуализировать, и поэтому я не могу использовать этот подход. - Несмотря на усилия по реализации контроллера объекта и созданию моих собственных контроллеров массива, я не могу получить такую ​​же функциональность здесь.

Любые предложения о том, как я могу добавить виджеты без повторного рендеринга всех виджетов?

0 ответов

Другие вопросы по тегам