我正在我的 Aurelia 应用程序中使用自定义元素。当我将 View 模型中的数据与自定义元素绑定(bind)时，它工作正常。即使我对自定义元素控件中的数据进行一些更改，由于双向数据绑定(bind)，该更改也会反射(reflect)到我的 View 模型中的数据。
但是，如果我对 View 模型中的数据进行一些更改(使用 JavaScript)，则自定义元素中的数据不会更新。我已经复制了这个问题以获得更简单的设置。
简单 View 模型
export class Playground {
public testObj: any;
counter = 0;
constructor() {
this.testObj = {
prop1: "This is prop1 value"
, collection2: [{ id: "item21" }]
}
}
updateProp1() {
alert("before update: "+this.testObj.prop1);
this.testObj.prop1 = "Sayan " + this.counter++;
alert(this.testObj.prop1);
}
verifyChange() {
alert(this.testObj.prop1);
}
}
简单 View
<template>
<h1>
Playground
</h1>
<div >
<div repeat.for="item of testObj.collection2">
<div class="row">
<div class="col-sm-4">
<input type="text" class="form-control" placeholder="prop1"
value.bind="$parent.testObj['prop1']">
</div>
</div>
</div>
<button click.delegate="updateProp1()" class="btn btn-primary"> Update Prop1 </button>
<button click.delegate="verifyChange()" class="btn btn-primary"> Verify Change </button>
</div>
</template>
现在，每当我在更改文本框中的值后单击验证更改时，更改后的值就会出现在警报中。但是，如果我单击 Update Prop1 按钮，prop1 值会更新，但更改不会反射(reflect)在 View 中。
我不确定我到底缺少什么。
注意:如果使用 $parent.testObj.prop1，则不使用 $parent.testObj['prop1']，数据绑定(bind)按其应有的方式工作。但是，我的实际自定义元素是通用类型，并且属性名称事先未知，因此似乎我需要继续使用 $parent.testObj['prop1'] 表示法而不是点符号:$parent.testObj.prop1。
欢迎指点/建议/反馈。
更新:如果有人能指出点符号和索引器符号之间的区别w.r.t。 aurelia 数据绑定(bind)(我已经检查过this)，这将有很大的帮助。
最佳答案
这是 aurelia/binding 模块早期版本中的一个问题。以下是相关问题:
我在最新版本的 aurelia 中尝试了您的 View / View 模型，一切正常。这是我所看到的截屏:http://screencast.com/t/KqcuqXWjkU2
确保您安装了最新版本的 aurelia 组件 - 更新步骤如下:http://blog.durandal.io/2015/05/01/aurelia-may-status-and-releases/
关于javascript - Aurelia 自定义元素数据绑定(bind)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30455292/