时间戳

首页 > 解决方案 > 如何访问shadowdom中的元素

angular - 如何访问shadowdom中的元素

问题描述

我只想访问 shadow-root 中的元素。在我的 Angular 应用程序中，我的一个组件用shadowDom封装。

@component({
  selector: "app-home",
  templateUrl: "./home.component.html",
  styleUrls: ["./home.component.scss"],
  encapsulation: ViewEncapsulation.ShadowDom
})

当我为应用程序提供服务时，这就是渲染元素的样子

<body class>
  <app-root _nghost-c0 ng-version="7.0.3">
    <router-outlet _ngcontent-c1=""></router-outlet>
      <app-home>
      #shadow-root (open)                                                 <== shadow-root
        <style>...</style>
        <style>...</style>
        <div id="main">
          <section id="one">
            <app-github-calendar _nghost-c3>
               <div _ngcontent-c3 class="calendar"> Loading the data just  <== this element
               for you.</div>
            </app-github-calendar>
          </section> 
      </app-home>

我试图获取“日历”元素 ussign javascript querySelector、getElementsByClassName、querySelectorAll等，但我无法获取元素。

告诉我如何得到它。

标签： angulardomshadow-domangular7

解决方案

推荐阅读