时间戳

首页 > 解决方案 > 从其他组件访问 Angular 7 中 index.html 中的元素

angular - 从其他组件访问 Angular 7 中 index.html 中的元素

问题描述

仅当记录使用时，我才需要显示聊天小部件。显示此聊天的脚本将在 index.html 中执行。但我需要验证用户是否已登录以显示此小部件。

而且我不知道我必须把这段代码放在哪里。该小部件开始被 index.html 中的 css 隐藏，我需要显示用户是否已登录。显示小部件的代码是：

// Show the widget.
document.getElementById("md-app-widget").style.visibility = "visible";

索引.html

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <title>APP</title>
        <base href="/" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <link rel="icon" type="image/x-icon" href="favicon.ico" />
        <style type="text/css">
            // Start widget hidden.
            .md-chat-widget-wrapper {
              visibility: hidden;
            }
        </style>
    </head>

    <body>
        <hb-app>
            <div class="sk-fading-circle">
                <div class="sk-circle1 sk-circle"></div>
                <div class="sk-circle2 sk-circle"></div>
                <div class="sk-circle3 sk-circle"></div>
                <div class="sk-circle4 sk-circle"></div>
                <div class="sk-circle5 sk-circle"></div>
                <div class="sk-circle6 sk-circle"></div>
                <div class="sk-circle7 sk-circle"></div>
                <div class="sk-circle8 sk-circle"></div>
                <div class="sk-circle9 sk-circle"></div>
                <div class="sk-circle10 sk-circle"></div>
                <div class="sk-circle11 sk-circle"></div>
                <div class="sk-circle12 sk-circle"></div>
            </div>
        </hb-app>
        <!-- This script shows a chat widget that be visible only with user is logged -->
        <script type="text/javascript">var mdChatClient="8AE83B4E23CE3A1671875001A27";</script>
        <script src="https://chat.movidesk.com/Scripts/chat-widget.min.js"></script>
       
    </body>
</html>

标签： angular

解决方案

use 可以简单地使用这个：

@Component({...})
export class AppComponent {
  @ViewChild('username') input: ElementRef<HTMLInputElement>;
}

推荐阅读