1

我有2个自定义控件parent-controlchild-control。我需要孩子代表父母执行功能。要求是孩子应该在家长范围内使用。创建新的bindingContext供儿童使用查看模型

使用例

...<content-around> <!-- this is 'outerContext' bindingContext --> 
    <parent-control shared.bind="outerContext.something"> 
    <div> 
     <child-control property="nameOfMemberOfShared"></child-control> 
    </div> 
    <div> 
     <span>some text here</span> 
     <child-control property="anotherNameOfMemberOfShared"></child-control> 
    </div> 
    </parent-control> 
</content-around>... 

父 - control.html

<template> 
    <slot></slot> 
</template> 

父 - control.ts(假设所有的进口)

export class ParentControlCustomElement { 
    @bindable shared: any; 

    bind(bindingContext, overrideContext) { 
    //here want to make sure elements rendered inside slot 
    //are able to access 'shared' 
    } 
} 

儿童control.html

<template> 
    <!-- this is for simplicity more advanced stuff needed here --> 
    <h1>${sharedObject[property]}</h1> 
</template> 

儿童control.ts(假设所有进口)

export class ChildControlCustomElement { 
    @bindable property: string; 
    sharedObject: any; 

    bind(bindingContext, overrideContext) { 
    this.sharedObject = bindingContext.shared; 
    // the problem is HERE! 
    // instead of getting a binding context pointing 
    // to parent-control view model I get binding context 
    // pointing to 'outerContext' 
    } 
} 

如何确保从parent-control开始内部组件将获得指向parent-control的视图模型的绑定上下文?

回答

3

如果你知道你的孩子控件将始终父控件内使用,你可以声明的祖先/父依赖性:

@inject(ParentControlCustomElement) 
export class ChildControlCustomElement { 
    constructor(parentControl) { 
    this.parentControl = parentControl; 
    } 
} 

如果你不能肯定你孩子是否会控制在父母内部使用,请使用@inject(Optional.of(ParentControlCustomElement))

+0

有趣的,让我试试 –

+0

优秀!!这按预期工作!非常感谢。 –