Question

我在主视图和自定义组件中都有文本输入。我希望它们的文本同步（更具体地说，来自main - ＆gt;子组件）。

以下是我所得到的：

app.html

<template>
  <require from="my-component"></require>
  Parent App Text: <input type="text" value.bind="mainAppText" />
  <br />
  <my-component myComponentText.bind="mainAppText"></my-component>
</template>

app.js

export class App {
  mainAppText;
}

my-component.html

<template>
  My Component Text: <input type="text" value.bind="myComponentText" />
</template>

my-component.js

import {bindable} from 'aurelia-framework';

export class MyComponent {
  @bindable myComponentText;
}

但myComponentText不会更新。我错过了什么？

Plunker：

http://plnkr.co/edit/infT53A3Y2aGbN9CR7B5?p=preview

Answer 1

尝试在此处检查您的代码（不要对属性使用此类命名）：http://plnkr.co/edit/qPkDqnLKa0I9nzJ0wTsc?p=preview

<my-component text.bind="mainAppText"></my-component>

和

@customElement('my-component')
export class MyComponent {
  @bindable
  text = '(default)';
}

Answer 2

尝试

<my-component myComponentText.two-way="mainAppText"></my-component>

我不确定它是不是规则，但我创造了“绑定”的经验。只能在标准属性上双向工作。

组件和子组件之间的Aurelia绑定不反映变化

2 个答案: