将属性从视图模型绑定到 Aurelia 中的自定义元素

UPDATE:

其他人报告说这个样本对他们来说效果很好。听起来好像我做错了什么，但我不再有代码，所以我无法检查问题出在哪里。

原问题：

我有以下自定义元素以及以下视图模型和视图：

import {bindable} from 'aurelia-framework';
export class Test1 {
  @bindable name = null;
}

<template>
  <div>Name: ${name}</div>
</template>

然后我有一个使用上面的自定义元素的视图和视图模型（这是骨架项目中的欢迎页面）：

export class Welcome {
  constructor() {
    this.name = 'Test';
  }
}

<template>
  <require from="./components/test1"></require>
  <test1 name.bind="name"></test1>
</template>

我的期望是看到“名称：测试”，但我只得到“名称：”。如果我使用字符串并删除“.bind”，那么它会起作用：

<test1 name="Test"></test1>

但我希望每当我更新“应用程序”视图模型中的“名称”字段时它都会自动更新。

我不确定我做错了什么。我在控制台中没有看到任何错误。

我将此示例基于 Aurelia 的骨架示例项目。 aurelia-framework 的版本是 0.11.0。

“Welcome”类中的 prop“name”应该是可绑定的。

import {bindable} from 'aurelia-framework';

export class Welcome {
  @bindable name = ''

  constructor() {
    this.name = 'Test';
  }
}