android-如何在angular 4中通过本机javascript调用角度函数

android-如何在angular 4中通过本机javascript调用角度函数,第1张

概述在Angular1.x中,我们可以使用angular.element(appElement).scope()获得$scope,然后使用$apply(),以便本机javascript可以直接调用angular函数或双向绑定.在Angular4中,我们如何通过本地JavaScript或androidnative调用angular函数或双向绑定.例如:该网络是由angular4开发的,它

在Angular 1.x中,我们可以使用angular.element(appElement).scope()获得$scope,然后使用$apply(),以便本机javascript可以直接调用angular函数或双向绑定.在Angular 4中,我们如何通过本地JavaScript或androID native调用angular函数或双向绑定.

例如 :

该网络是由angular 4开发的,它将在androID webvIEw中使用,因此它需要与androID进行交互,我该如何处理这种交互?

解决方法:

我可以想到很多方法,但从未阅读过手册中的任何内容,这些内容澄清了大多数Angular方法.

区域

您必须记住,Angular在引擎的核心使用区域和更改检测树.因此,任何外部访问都需要在这种情况下发生.

您必须在Angular区域中运行外部代码:

zone.run(() => {      // do work here});

如果对将直接或间接影响模板表达式的任何数据进行更改,则存在更改检测错误的风险.因此,组件需要注入ChangeDetectorRef并调用markForCheck.

因此,如果您的代码在组件内部运行但在Angular外部运行.您需要这样做:

zone.run(() => {    // do work here.    this.ChangeDetectorRef.markForCheck();});

尽管如此,这还是提出了一个问题.我如何到达组件?

访问角度

您必须引导Angular应用程序,以便可以对其进行访问.

当您引导Angular应用程序时,浏览器服务会将诺言返回给主模块.该主模块包含注射器,您可以从那里访问任何导出的服务.

platformbrowserDynamic()    .bootstrapModule(AppModule)    .then((modRef: NgModuleRef<AppModule>) => {         window.myGlobalService = modRef.injector.get(MyServiceClass);    });

这会将服务类放置为全局变量.您必须创建一个转发到Angular区域的API.

@Injectable()export class MyServiceClass {     public dataEmitter: Subject<any> = new Subject();     public constructor(private zone: ngzone) {}     public foobar(data: any): any {         return this.zone.run(()=>{             // do work here             this.dataEmitter.next(data);             return "My response";         });     }}

您可以从zone.run的服务中返回结果.关键是Angular代码在正确的区域中运行.

简易组件单向绑定

单向数据绑定的最简单解决方案是仅将事件模块用于DOM.

@Component({....})export class MyComponent {    @HostListener('example',['$event'])    public onExample(event: Event) {        console.log(event.foobar);    }}// else where in external JavaScriptvar elem; // the DOM element with the componentvar event = new Event('example', {foobar: 'Hello from Js!'});elem.dispatchEvent(elem);

我喜欢这种方法,因为Angular会像处理其他任何类型的事件(即click事件)一样处理事件监听器

您也可以采用其他方法.让组件在其ElementRef上发出DOM事件,以供外部JavaScript侦听.这使得整个双向通信成为更多的DOM标准.

总结

以上是内存溢出为你收集整理的android-如何在angular 4中通过本机javascript调用角度函数全部内容,希望文章能够帮你解决android-如何在angular 4中通过本机javascript调用角度函数所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1080359.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-27
下一篇 2022-05-27

发表评论

登录后才能评论

评论列表(0条)

保存