Aurelia：如何观察绑定对象的特定属性（自定义属性）

Question

我想观察绑定到自定义属性的对象特定属性的更改事件。我为此使用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（因为属性的数量）。

Answer 1

我设法解决这个问题; （感谢马克·沙伊布的评论）

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(); 
    } 
} 

Answer 2

据我所知，没有办法绑定到嵌套的属性值，不幸的是。可观察系统基于Aurelia可以重写的属性，以便在框架发生更改时通知它们。因为您将更新嵌套属性而不是info属性本身，所以不会触发通知。我认为最好的办法就是像你在“参与”中提到的那样去做，然后创建一个单独的财产，然后再观察。

关于款式的说明。你可能已经意识到了这一点，但你实际上并不需要这个装饰器@customAttribute('my')。这将是Aurelia会议系统的默认行为，因此您可以将其保留，最终结果将保持不变。