Аурелия: Как наблюдать определенное свойство связанного объекта (пользовательский атрибут)
Я пытаюсь наблюдать событие изменения конкретного объекта, привязанного к пользовательскому атрибуту. Я использую bindable
тег для этого.
Предмет
var information = {
name: 'foo',
description: 'bar',
age: 12
};
Элемент
<div my="info: information;"></div>
Атрибут
@customAttribute('my')
export class MyCustomAttribute {
@bindable({
changeHandler: 'change'
})
public info: any;
private change(): void {
console.log('info has changed')
}
}
Приведенный выше пример запускает обработчик изменений только один раз. Но мне нужно, чтобы он срабатывал каждый раз, когда одно из свойств на info
объект меняется. В моем случае использования не имеет значения, какое свойство изменяется, мне просто нужно знать, когда свойство изменяется.
Есть идеи, как это сделать?
FYI => Другой подход будет состоять в том, чтобы создать отдельное свойство в модели представления (и использовать связываемые теги для этого) вместо использования объекта, но я бы предпочел этого не делать, потому что это сделало бы утомительное использование атрибута в HTML (из-за количества свойств).
2 ответа
Мне удалось решить это таким образом; (благодаря комментарию Марка Шейба)
import { BindingEngine, Disposable } from 'aurelia-framework';
@customAttribute('my')
export class MyCustomAttribute {
@bindable public info: any;
private subscription: Disposable;
constructor(
private binding_engine: BindingEngine
) { }
public attached(): void {
this.subscription = this.binding_engine
.propertyObserver(this.info, 'name')
.subscribe(() => this.change())
}
private change(): void {
console.log('info name property has changed')
}
public detached(): void {
this.subscription.dispose();
}
}
Насколько я знаю, к сожалению, нет способа привязать значения вложенных свойств. Наблюдаемая система основана на свойствах, которые Aurelia может переписать, чтобы уведомить структуру при их изменении. Потому что вы будете обновлять вложенные свойства, а не info
Само свойство, никаких уведомлений не будет запущено. Я думаю, что лучшим подходом было бы сделать, как вы упомянули в FYI, и создать отдельное свойство, которое вы затем наблюдаете.
Заметка о стиле. Возможно, вы уже знаете об этом, но на самом деле вам это не нужно @customAttribute('my')
декоратор. Это будет стандартное поведение системы конвенций Аурелии, так что вы можете оставить его, и конечный результат будет таким же.