首页 文章

在非角度页面中喷洒Angular 2组件

提问于
浏览 次
22

目前正在查看Angular 1 - > Angular 2的升级路径，我们使用Angular 1工作完成的一件事就是在面向公众的非应用页面上重用我们的一些组件 .

这些页面实际上是静态HTML（尽管它们由Rails呈现），然后一些Angular 2组件被放入页面中 . 这与Angular 1有关，我们只是使用提供了我们需要的指令和组件的模块来引导文档元素 . 根本没有路由 .

使用Angular 2，它看起来像是全有或全无 . 您声明一个根组件，并通过它呈现所有内容 . 这对我们来说是一个很大的转变，我想避免改变我们在这些面向公众的页面上做事的方式 .

是否可以在静态HTML页面中根据需要使用Angular 2组件，还是需要转移到单个根元素SPA设计？

简而言之，我要问的是，是否可以将静态内容与动态角度组件混合在一起，或者必须将所有角度组件都放在页面上的单个根元素中？

angularjs angular

2 回答

  • 1

    所以这比我原先想象的要简单 . 在the Angular 2 docs中，它围绕引导多个应用程序有一些特定的措辞 .

    引导多个应用程序在浏览器窗口中工作时，有许多单例资源：cookie， Headers ，位置等 . 表示这些资源的Angular服务同样必须在占用相同浏览器窗口的所有Angular应用程序之间共享 . 出于这个原因，Angular只创建一个存储所有共享服务的全局平台对象，每个角度应用程序注入器都将平台注入器作为其父级 . 每个应用程序也有自己的私人注入器 . 当页面上有多个应用程序时，Angular会将每个应用程序注入器的服务视为该应用程序的私有服务 .

    所以很明显，这是可能的，并且多个应用程序共享服务资源，这是我希望的 .

    我用多个自举组件做了一些简单的测试，它工作正常 . 我尚未尝试的一件事是在Angular 2组件之外引导Angular 2 attribute directive . 我怀疑它不起作用，并且引导程序仅适用于组件而不是指令 .

    在指导方面，我建议Angular 2并非真正设计用于整个静态页面中的洒水行为，并且可能不应该以这种方式使用 . 相反，虽然您可能有多个应用程序定义的分页的多个部分，但这些组件几乎应构成所有文档/界面 .

    回复于
  • 9

    我们只是使用提供了我们需要的指令和组件的模块来引导文档元素 . 根本没有路由

    's exactly how I' m目前正在使用Angular2 . 请参阅https://github.com/niczero/ng2-es5-file-upload/blob/master/demo/index.html上的示例 - 我的一些'static'页面是由perl生成的，与您使用ruby的方式相同 .

    顺便说一句，如果你拥抱Universal Module Definitions，能够以两种方式使用你的模块都会容易得多

    回复于

相关问题