0

我有一个自定义元素层次结构，看起来select-single <- dropdown <- dropdown-wrapper每个名称都是一个自定义元素，每个箭头代表一个使用该自定义元素的模板。

当我使用select-single时，attached处理程序调用selectedChanged()设置options为绑定值，但doSelect未定义。显示页面后，单击select-single控件中的元素会触发click.trigger并且两个绑定属性都是有效值。

是否有关于 Aurelia 生命周期的规则阻止doSelect函数被绑定，即使options在同一个生命周期步骤绑定？

选择-single.html

<template>
    <div class="select-single"
            if.bind="options.length">        
        <label            
            class="select-single-option"
            repeat.for="option of options"
            click.trigger="selectedChanged(option)">
            ${option.name}
         </label>
    </div>
</template>

选择-single.js

import {
    bindable
} from 'aurelia-framework';

@bindable({
    name: 'options',
    defaultValue: []
})

@bindable({
    name: 'doSelect',
    defaultValue: null
})

export class SelectSingle {
    constructor() {
        let self = this;
        this.selectedChanged = function(option) {
            self.doSelect(option);
        }
    }

    attached() {
        for(let ii = 0; ii < this.options.length; ii++){
            if(!!this.options[ii].defaultSelection){
                this.selectedChanged(this.options[ii]);
            }
        }
    }
}

索引.html

<select-single options.bind="options" do-select.bind="doSelect"></select-single>
4

0 回答 0