如何从angular 8中的javascript函数触发打字稿函数答案

【问题标题】：how to trigger typescript funtion from javascript function in angular 8如何从angular 8中的javascript函数触发打字稿函数
【发布时间】：2020-07-21 21:22:30
【问题描述】：

我正在处理一个任务，其中我有一个事件侦听器 window.addEventListener，它在 javascript 中，基于事件数据我想触发一个打字稿函数并将数据传递给该函数。我没有得到的一点是如何在 javascript 中调用 typescript 函数。我尝试过不同的东西，比如全局变量，从 js 函数返回一个值，但对我不起作用。

ngOnInit() {
  (function ($) {
    $(document).ready(function () {
      window.addEventListener('message', function (event) {
        console.log("Rece new Call event ibrahim " + JSON.stringify(event.data));
        let obj: any = JSON.stringify(event.data)
        obj = JSON.parse(obj);
        console.log(obj)
        if (obj.EventType === "handleContactIncoming") {
        
          var num = obj.Number
         // here i want to trigger Typescript function and pass this num to that function.
            
        }
        else if (event.data === "endCall") {
     //     return "No"
          // var dbBtn = document.getElementById("db");
          // dbBtn.click();
        }
        // $('.sidebar-menu').tree();
      });
     
    });
  });

【问题讨论】：

这能回答你的问题吗？ Calling properly TypeScript code from JavaScript
这能回答你的问题吗？ Accessing class method from console in angular typescript

标签： javascript angular typescript

【解决方案1】：

从 TS 或 JS 调用函数没有区别。最后浏览器里永远只有JS，TS只存在于源码中。

你的代码也有点乱。不需要在 Angular 中使用 jQuery（当你想使用一些插件或自定义控件时除外）。

$(document).ready(function () {

也是多余的，如果角度有效，文档肯定已经准备好了。

【讨论】：

【解决方案2】：

您的代码非常混乱，并且破坏了关注点分离。你不应该在 Angular 中使用 jQuery。可注入的EventManager 提供了在window 或document 对象上设置事件的功能。

constructor(private readonly eventManager: EventManager) {}

ngOnInit(): void {
  this.eventManager.addGlobalEventListener(target, event, () => {
    this.hello();
  });
}

hello(): void {
  console.log('Hello World!');
}

【讨论】：