在我的自定义元素中,我有一个可绑定的属性" menu"从外面设置。我的问题是"菜"在菜单属性设置之前,依赖于菜单的属性被查询(因此菜单未定义且菜肴无法检索)。我能在这做什么?
菜单-control.ts:
import { bindable } from 'aurelia-framework';
import { Menu } from '../../../app/model/menu';
import { Dish } from '../../../app/model/dish';
export class MenuControl {
@bindable menu: Menu;
get dish1() {
return this.getDish(1);
}
get dish2() {
return this.getDish(2);
}
get dish3() {
return this.getDish(3);
}
getDish(dishNo: number) {
return this.menu.dishes.find(x => x.dishNo == dishNo);
}
}
菜单-control.html:
<require from="../dish-control/dish-control"></require>
<div class="tab-content" style="margin-top: 20px; width: 800px;">
<div class="tab-pane fade in active">
<div class="row">
<div class="col-md-8">
</div>
<div class="col-md-2" style="padding-left: 0;">
</div>
<div class="col-md-2" style="padding-left: 0;">
<label>Vegetarisch</label>
</div>
</div>
<h4>Menü 1</h4><dish-control dish.bind="dish1"></dish-control>
<h4>Menü 2</h4><dish-control dish.bind="dish2"></dish-control>
<h4>Menü 3</h4><dish-control dish.bind="dish3"></dish-control>
</div>
</div>
答案 0 :(得分:0)
您应该能够将if.bind="menu && menu.dishes"
放在任何父组件上<dish-control>
,甚至<dish-control>
本身。这样,<dish-control>
不会被附加到DOM并初始化自己,直到this.menu.dishes
存在。