在自定义属性中绑定多个表达式

Question

我在Aurelia自定义属性中绑定多个表达式时遇到问题.我发布这个因为我一直在努力,我相信文档可能会丢失一些东西(？).希望这不是我错过的一些愚蠢的事情,以便更多的人也会使用这个.

这是我简化的实现.

resultCustomAttribute.js

import {inject, bindable} from 'aurelia-framework';

@inject(Element)
export class resultCustomAttribute {
    @bindable foo;
    @bindable bar;
    constructor(element) {
        this.element = element;
        console.log(this.foo); // => null
        console.log(this.bar); // => null
    }
    fooChanged(value){
        console.log(value) // Does not run
    }
}

main.js

export function configure(aurelia) {
    aurelia.use
        .standardConfiguration()
        .developmentLogging()
        .feature('resources'); // resources is a folder in the source root
                                  with an index.js file that sets my custom
                                  attribute as a globalResource 

    aurelia.start().then(a => a.setRoot());
}

home.html的

<template>
    .
    .
    .
    <div repeat.for="item of items"> <!-- items is an array of objects in home.js-->
        <h4>${item.title}</h4>
        <div result="foo.bind: item.foo; bar.bind: item.bar">
            ...
        </div>
    </div>
    .
    .
    .
</template>

问题是,无论我绑定foo和bar,它们都会成为null我的自定义属性.但是,该元素正确传递给resultCustomAttribute.我的实施是正确还是我错过了什么？

编辑:毕竟上面的实现似乎是正确的.当我简化我的代码以提供一个通用问题时,我删除了camelCase命名变量selectionIndex并将其替换bar为如上所示.这导致selectionIndexChanged函数无法运行.

并且在构造函数中this.foo并且this.bar为null的共振仅仅是因为构造函数在第一次更改值之前运行.

Answer 1

这有点令人尴尬.突然问这个问题foo变量开始工作,我找不到如何重现我原来的问题.fooChanged运行正常,但我barChanged仍然没有运行.

这是因为bar变量实际上并没有在我的实际代码中命名为bar,它是一个带有camelCase命名的变量selectionIndex.当使用camelCase命名aurelia没有selectionIndexChanged正确勾选我.我将其更改为selectionindex和selectionindexChanged现在两个变量都应该绑定.

抱歉浪费空间.但也许这对某人有用.

编辑 请参阅shunty的评论,了解如何在自定义属性中使用camelCase