2

我正在尝试观察绑定到自定义属性的对象特定属性的更改事件。我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对象的属性之一发生更改时，我都需要它触发。在我的用例中，哪个属性更改并不重要，我只需要知道属性何时更改。

关于如何做到这一点的任何想法？

仅供参考 => 另一种方法是在视图模型上创建一个单独的属性（并在其上使用可绑定标签）而不是使用对象，但我宁愿不这样做，因为它会使 HTML 中的属性管道变得乏味（因为属性的数量）。

4

2 回答 2

4

我设法以这种方式解决了它；（感谢 Marc Scheib 的评论）

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();
    }
}
于 2017-09-07T09:16:50.400 回答
1

据我所知，不幸的是，没有办法绑定到嵌套的属性值。可观察系统基于可以由 Aurelia 重写的属性，以便在更改时通知框架。因为您将更新嵌套属性而不是info属性本身，所以不会触发任何通知。我认为最好的方法是按照您在 FYI 中提到的那样做，并创建一个单独的属性，然后您将观察它。

关于风格的说明。您可能已经意识到这一点，但您实际上并不需要这个@customAttribute('my')装饰器。这将是 Aurelia 约定系统的默认行为，因此您可以将其省略，最终结果将是相同的。

于 2017-09-05T04:26:36.057 回答