динамическое зацикливание на свойстве контроллера - PullRequest
Новая
       2

динамическое зацикливание на свойстве контроллера

1 голос
/ 15 апреля 2019

Я использую ember 2.17.

Я добавил это свойство в controller: 

export default Controller.extend({
  newAttachments: new Array()
  ...
})

Я добавляю в него элементы через этот контроллер action: 

setAttachment(file) {
  console.log('trying');
  this.get('newAttachments').push(file);
}

Когда я использую действие, сообщение отображается в консоли, и в инспекторе Ember я вижу, что массив больше не пуст:

enter image description here

Однако следующий код в представлении не имеет вывода: 

{{#each newAttachments as |file|}}
  <p>in loop</p>
{{/each}}

Почему он ничего не отображает?В компоненте это будет работать, почему бы и нет?

1 Ответ

3 голосов
/ 15 апреля 2019

Эмбер не может наблюдать за массивами.Поэтому фреймворк не знает, что значение помещается в массив.Вы должны использовать собственный ember Ember.NativeArray, и вместо него используется pushObject метод .Это гарантирует, что платформа будет проинформирована, если запись добавлена ​​или удалена из массива.Измененный код будет выглядеть следующим образом: 

import { A } from '@ember/array';

export default Controller.extend({
  newAttachments: A(),

  setAttachment(file){
    this.get('newAttachments').pushObject(file)
  }
})

Не следует добавлять массив как свойство EmberObject, так как это может привести к утечке между экземплярами.Это не производственная проблема в этом случае, потому что контроллеры - это одиночные файлы в ember.js.Но вы можете увидеть странное поведение в тестах.Рефакторинг для нативных классов решит эту проблему, поскольку поля классов не просочились между экземплярами.Для старых классов на основе EmberObject инициализация значения в init hook или использование вычисляемого свойства являются распространенными способами решения этой проблемы: 

// computed property
import { computed } from '@ember/object';
import { A } from '@ember/array';

export default Controller.extend({
  newAttachments: computed(() => A()),
});

// init hook
import { A } from '@ember/array';

export default Controller.extend({
  init() {
    this._super(...arguments);

    this.set('newAttachments', A());
  }
});

Обратите внимание, что вам не нужно использовать get() если работает Ember> = 3.1.

...