我有一個網站，我在該網站上運行了清晰的聊天服務，我試圖從我的組件的打字稿檔案之一中單擊聊天框。
清晰的聊天框是一個帶有crisp-clientinsidebody標簽id的div 。如何從我的打字稿中點擊它？
uj5u.com熱心網友回復：
在建構式中注入 Renderer2 -
constructor(private renderer: Renderer2) {}
在您的組件中獲取清晰的客戶端元素 -
let crispClient = this.renderer.selectRootElement('#crisp-client');
執行 click() 事件 -
crispClient.click();
作業演示在這里
在 div 上添加了一個測驗方法來檢查 -
<div id="crisp-client" onClick="console.log('crisp client clicked')"></div>
uj5u.com熱心網友回復：
您可以使用ViewChild裝飾器并將模板參考變數作為字串傳遞，并操縱事件。這是一個簡單的click示例Button 1，它以編程方式點擊Button 2，由于該點擊， 的文本Button 2發生了變化：
<button #button1 (click)="clickButton2()">
Click to change the text of Button 2
</button>
<button #button2 (click)="changeText()">{{ buttonText }}</button>
buttonText = 'Button 2';
@ViewChild('button2') button2: ElementRef<HTMLElement>;
clickButton2() {
let el: HTMLElement = this.button2.nativeElement;
el.click();
}
changeText() {
this.buttonText="Changed!"
}
這是一個 Stackblitz 演示
更新
您可以document在 Angular 中使用object訪問 body 的元素。這樣就可以實作點擊里面的元素了body。這是另一個示例，我單擊body組件內部的按鈕。
<button (click)="handleClick()">Programatically click the button inside body</button>
ngOnInit() {
let btn = document.getElementById('main');
btn.addEventListener('click', (e: Event) => btn.innerHTML = "Clicked!");
}
handleClick() {
document.getElementById('main').click();
}
索引.html
<html>
<body>
<my-app>loading</my-app>
<button id="main">Click</button>
</body>
</html>
這是一個Stackblitz演示。
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/381389.html
標籤：javascript 有角的 打字稿
上一篇：如何在同一頁面上兩次輸出Js函式