Angular / Kendo - 弹出元素附加到 DOM 的最末端

Question

如果我打开 kendo 下拉列表或任何来自 kendo 的具有弹出窗口之类的内容，每次它都附加到 DOM 的最末尾，当我想重新设置它的样式时，这是一个问题（因为它的组件用于下拉、组合框、自动完成、下拉按钮） ）...有什么方法可以将此弹出窗口附加到 DOM 中的组件本身吗？我听说有可能，但找不到任何解决方案。

谢谢你:)

Answer 1

不，无法更改弹出窗口附加到 DOM 的方式。 但是，您仍然可以按照自己想要的方式设置它们的样式，因为每个弹出窗口都有不同的 CSS 类名称。

例如：

• k-calendar-container

  对于

  kendo.ui.DatePicker

• k-list-container

  代表

  kendo.ui.DropDownList

  和

  kendo.ui.AutoComplete

我创建了一个示例：https://jsfiddle.net/Metoule/1kfgct3x/

另请注意，根据您实际想要实现的目标，

template

属性可能是您的最佳选择，例如对于自动完成小部件。

Answer 2

过了一段时间，您可以使用 popupSetting 和appendTo 属性将弹出窗口附加到 kendo 下拉列表中：

<kendo-dropdownlist
  [popupSettings]="{appendTo: 'component'}">
</kendo-dropdownlist>