Aurelia自定義元素實例創建

Question

當綁定對象更新時，如何啟動創建自定義元素的新實例？ 假設我在視圖中有一個visitDate，用戶可以更改它。 更改后，我想更新頁面的內容。 視圖模型：

...
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>

注意：shift-form是一個自定義元素。 現在，如果我在視圖中更改了visitDate，它將調用visitDateChanged（）並更新newShift並移動變量。 它分離所有在div repeat.for內部調用的shift形式的實例，並根據shifts數組內的對象附加新實例。 但是它不會在第二個div內分離並重新附加shift-form（不會創建shift-form的新實例）。 當重新創建newShift時，我需要在div中有一個shift形式的新實例。 我設法通過將newShift從一個對象更改為一個數組來做到這一點。 然后

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

可以解決問題，但我認為這不是一個優雅的解決方案

Answer 1

正如阿什利·格蘭特（Ashley Grant）所建議的那樣，我具有重置功能，但是我沒有聽更改。 我有一個ref的元素，並在需要時在外部調用reset函數。

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

並在使用此引用的控制器中：

this.someVariableNameHere.viewModel.reset();