使用PanelBar标题中的kendo下拉列表，标题捕获所有事件并防止下拉操作。

Question

在KendoPanelBarItemTitle中放置一个剑道组合框，则组合框无法工作。

看起来标题是捕获所有事件

下面的例子

​

            <kendo-panelbar-item [title]="'Copy from Existing Scenarios'" color="secondary" expanded="true">
                <ng-template kendoPanelBarItemTitle>
                    <span fxFlex></span>
                                <label style="margin:5px 5px 0 0">Source: </label>
                                <kendo-combobox
                                    fxFlex="100"
                                    [data]="otherScenarios | async"
                                    [valuePrimitive]="true"
                                    [textField] ="'Name'"
                                    [valueField] = "'ScenarioId'"
                                    class="mr-1"
                                    placeholder="Source"
                                    [disabled]="!copyFromExpanded"
                                    [(ngModel)]="sourceScenarioId"
                                    name="SourceScenarioId">
                                </kendo-combobox>
                </ng-template>
                <ng-template kendoPanelBarContent>
                    stuff here
                </ng-template>
            </kendo-panelbar-item>

​

Answer 1

如果需要防止标题捕获某些子元素上的鼠标单击事件，请创建并使用appClickStopPropagation指令(如何创建一个：https://stackoverflow.com/a/41001184/9871385)。

<ng-template kendoPanelBarItemTitle>
    Click on me to toggle kendoPanelBarItem.
    <some-element appClickStopPropagation>Click on me and nothing toggles.</some-element>
</ng-template>