Javascript 通过属性将对象传递给自定义组件

如何通过Aurelia中的属性将对象传递给自定义组件

我的自定义组件类如下所示：

import {bindable} from 'aurelia-framework';

export class PageHeading {
    @bindable title = '';
    @bindable subTitle = '';
    @bindable path;

    constructor() {
        console.log('page heading...' + this.subTitle);
    }

    created() {
        console.log('created.. ', this.path);
    }
}

在html文件中，我使用如下组件：

<page-heading title="Dashboard" sub-title="your starting point" path="${path}"></page-heading>

---

这对于

title

和

subTitle

这样的字符串很好，但我不确定如何将对象传递给组件。这可能吗？如果是，如何在Aurelia中执行此操作？

使用

bind

命令将属性绑定到元素的标题可绑定属性：

或者将

bind

命令与对象文字绑定表达式结合使用：

注意：支持ES6对象文字速记语法-假设您的虚拟机上有

foo

、

bar

和

baz

道具，这将起作用：