使用 angular 访问全局对象
Accessing global objects with angular
我想知道访问全局对象并在 Angular 应用程序中针对这些对象发出一些事件的最佳方法,例如(window、本地存储、文档或任何其他目的)
像 JS 对象一样调用它是正确的还是我应该坚持 Angular 这样做的方式?
如果不允许我在 angular 应用程序中使用 jQuery 等任何其他库来操作 DOM?
最常见的方法是使用服务来跟踪应用程序周围的对象。无论您想在何处访问某些数据,只需注入相应的服务即可。您可以在此处阅读有关服务的更多信息:https://angular.io/tutorial/toh-pt4
当谈到 DOM 操作时,Angular 有自己的功能来与 DOM 通信。例如,您可以使用内置的 Renderer2 来操作 DOM。您还可以访问某些元素引用的 nativeElement。不建议使用 Vanilla JS 或 jQuery.
手动更新 DOM
我会提出以下建议:
不要访问文档对象进行 DOM 操作或使用 JQuery。 Angular 本身提供了操作 DOM 所需的所有方法。结合使用 Angular 和 JQuery 将是一种反模式 (IMO)。
Angular 中有一些工具可以让您操纵 DOM:
- Template syntax,用于动态输出html文本
- NgClass,用于动态添加字符串
- *NgIf directive,用于有条件地显示某些 DOM 元素
- Renderer2,用于进行各种 DOM 操作。
您可以直接从 angular 应用程序访问 localstorage 和 sessionstorage 等内容。
为了保存您的全局数据,我建议您使用允许组件轻松地在彼此之间共享数据的服务。
当然,理论上你可以添加 jQuery 或另一个库来进行 DOM 操作,但这首先违背了使用 Angular 的全部目的。因为我们想使用 Angular 以相对简单的方式创建 SPA 的应用程序。
我想知道访问全局对象并在 Angular 应用程序中针对这些对象发出一些事件的最佳方法,例如(window、本地存储、文档或任何其他目的)
像 JS 对象一样调用它是正确的还是我应该坚持 Angular 这样做的方式?
如果不允许我在 angular 应用程序中使用 jQuery 等任何其他库来操作 DOM?
最常见的方法是使用服务来跟踪应用程序周围的对象。无论您想在何处访问某些数据,只需注入相应的服务即可。您可以在此处阅读有关服务的更多信息:https://angular.io/tutorial/toh-pt4
当谈到 DOM 操作时,Angular 有自己的功能来与 DOM 通信。例如,您可以使用内置的 Renderer2 来操作 DOM。您还可以访问某些元素引用的 nativeElement。不建议使用 Vanilla JS 或 jQuery.
手动更新 DOM我会提出以下建议:
不要访问文档对象进行 DOM 操作或使用 JQuery。 Angular 本身提供了操作 DOM 所需的所有方法。结合使用 Angular 和 JQuery 将是一种反模式 (IMO)。
Angular 中有一些工具可以让您操纵 DOM:
- Template syntax,用于动态输出html文本
- NgClass,用于动态添加字符串
- *NgIf directive,用于有条件地显示某些 DOM 元素
- Renderer2,用于进行各种 DOM 操作。
您可以直接从 angular 应用程序访问 localstorage 和 sessionstorage 等内容。
为了保存您的全局数据,我建议您使用允许组件轻松地在彼此之间共享数据的服务。
当然,理论上你可以添加 jQuery 或另一个库来进行 DOM 操作,但这首先违背了使用 Angular 的全部目的。因为我们想使用 Angular 以相对简单的方式创建 SPA 的应用程序。