一个老问题,但我喜欢它。没有一个简单的答案,所以我是这样做的:
精简版
了解内部结构以及我如何包装 Google Maps Javascript API 库
长版
以下是非常抽象的,但这是一个抽象的问题,所以这里......
您可能需要实现的基本内容是:
- 检测 Angular 库中的更改并将它们委托给本机库。
- 检测本机事件并将它们冒泡到您的 Angular 库中。
- 使用
NgZone
.
其他考虑因素可能是性能、可伸缩性、在现有工具上添加新工具等。无论您处理的是什么库,您最终都可能将函数与函数、类与类、模块与模块等
问题出现了:“我应该手动编写所有代码吗?我真的要为每个本机方法编写一个方法吗??当本机库更改实现时会发生什么?我将不得不在任何地方更改我的代码......“
为了简化包装库并使您的包装库具有可扩展性,您可以自动化包装机制(一种方法是使用 Javascript Proxy
)对象。将它与 TypeScript 的实用程序类型和扩展接口相结合,您可以创建一个自动将调用委托给相关本机对象/函数的类,并且您将获得智能感知(对于您不需要在包装器中手动实现的方法! )。
这是更详细的示例说明
对于事件委托,您可以创建一种机制来为您的本机事件生成可观察对象(或 EventEmitters)。
在某些情况下,您应该考虑使用NgZone.runOutsideAngular()
以防止对在本机库中执行的代码运行不必要的更改检测。另一方面,您应该考虑NgZone.run()
在运行本机代码时将执行带入 Angular 的区域,这些代码应该进入并影响变更检测周期。
我的 Angular 谷歌地图库是开源的,你可以看看。我在其中实现了一些非常有趣的架构机制。欢迎任何遇到此帖子并需要更多详细信息或帮助的人与我联系。
干杯