Создание экземпляра пользовательского элемента Aurelia

Как инициировать создание нового экземпляра настраиваемого элемента при обновлении связанного объекта? Предположим, у меня есть визитка в представлении, которое может быть изменено пользователем. Когда он изменился, я хочу обновить содержимое страницы. View-модель:Создание экземпляра пользовательского элемента Aurelia

... 
visitDateChanged() { 
    this.shifts = []; 
    this.newShift = {}; 
    this.newShift = {pstart: this.visitDate, pstop: this.visitDate}); 
    this.service.getData(this.visitDate) 
     .then(result => this.shifts = result); 
    } 
}

вид:

<div repeat.for="shift of shifts | filterDate: visitDate"> 
    <shift-form shift.bind="shift" shifts.bind="shifts"></shift-form> 
</div> 
<div> 
    <shift-form shift.bind="newShift" shifts.bind="shifts"></shift-form> 
</div>

Примечание: сдвиг-форма представляет собой пользовательский элемент. Теперь, если я изменяю visitDate в представлении, он вызывает visitDateChanged() и обновляет переменные newShift и shifts. Он отделяет все экземпляры сменной формы, вызываемые внутри div repeat.for, и присоединяет новые экземпляры в соответствии с объектами внутри массива shift. НО он не отсоединяет и не присоединяет форму сдвига (не создает новый экземпляр сменной формы) во втором div. И мне нужен новый экземпляр сменной формы внутри div, когда newShift воссоздается. Мне удалось это сделать, изменив newShift с объекта на массив из одного. Тогда

<div repeat.for="shift of newShift"> 
    <shift-form shift.bind="shift" shifts.bind="shifts"></shift-form> 
</div>

делает трюк, но я не думаю, что это элегантное решение

источник

2016-08-24 antarktikka

Что о создании 'функции shiftChanged', чтобы вы знали, когда' shift' изменения свойств (когда newShift сбрасывается)? Не могли бы вы объяснить, почему вам нужно воссоздать весь пользовательский элемент? –

Да, я могу объяснить. В переменной shift есть много переменных, заданных методами пользовательского элемента, и все они должны быть сброшены, если я использую shiftChanged. Это на самом деле больше кода, и я могу забыть сбросить некоторые переменные случайно. – antarktikka

Я не совсем уверен, что вы пытаетесь сделать, но почему бы вам не удалить вторую форму «бестселлера» и просто нажать новый элемент (может быть пустой объект) на массив shifts? Тогда смена формы будет создана/уничтожена для вас. – thinkOfaNumber

Как Эшли Грант предложил у меня есть функция сброса, но я не слушаю перемен. У меня есть ссылка ref для элемента, и я вызываю функцию сброса снаружи, когда это необходимо.

<some-element controller.ref='someVariableNameHere'></some-element>

и в контроллере, который использует этот реф:

this.someVariableNameHere.viewModel.reset();

источник

2017-04-12 12:07:36 DimitarKostov

Создание экземпляра пользовательского элемента Aurelia

ответ

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