Angular 2 - 不同静态页面上任何布局中的多个组件
我有一堆静态页面,使用各种组件放在HTML设计师喜欢的任何地方.例如,在WordPress网站的任何页面内.
虽然这里显示的示例组件是简单的面板,但实际上有各种组件,例如搜索,列表,编辑器,视图等......
目前,它们已在许多Wordpress站点上完成,其中每个页面都可以具有完全不同的布局.在过去,我们使用Angular 1.5,WP开发人员可以将我们的app标签放在身体附近,然后任何小部件(我们大约30个)可以在任何页面中放置1次或更多次.
组件可以重复使用,因此通过bootstrap []属性创建组件根组件没有意义,因为您只能在页面上使用一次根组件.如我的第二个例子所示.
技术1
这是第一次设置的截图和Plunker.请注意,我有4个区域,其中我放置了3个组件,组件1被重用.
这个例子是通过在单个根组件中布置组件来完成的,这对于我的Wordpress Pages具有完全不同的布局和组合要求的用例是不切实际的..
技术2
我尝试使用一种技术,其中每个窗口小部件作为根组件进行自举,基于此非自适应页面内的Bootstrapping Multiple Applications Sprinkling Angular 2组件.
但是当我使用这种技术时,小部件的第二个实例不会加载.AKA小工具1.
请参阅bootstrapping示例
技术2 - 还有其他问题
如果你已经引导了3个根组件,你必须使用它们全部,否则Angular会抛出你没有使用的根组件的错误.
技术3
使用<ng-content></ng-content>似乎不起作用的根组件.
| 归档时间： |
|
| 查看次数： |
2477 次 |
| 最近记录： |