[Angular 8] Take away: Web Components with Angular Elements: Beyond the Basics
This post is based on the NG-CONF talk, check the talk by yourself.
1. Dynamiclly add Angular Element into your application:
Once you have angular element, then inside your new application, you can use 'docuemnt.createElement' to add it:

2. Lazy loading Angular element
First Register module in angular.json:

Then load with NgModuleFactoryLoader:

3. External elements
If you have a project A with some custom elements you want to share with other project, it is possible to bundle project A and load with other projects.
The bundle size is huge, it is not a offical way. Not recommeded yet. The bundle will be servel files, you can use tool to concat into one bundle file: https://github.com/manfredsteyer/ngx-build-plus
[Angular 8] Take away: Web Components with Angular Elements: Beyond the Basics的更多相关文章
- 在angular项目中使用web-component ----How to use Web Components with Angular
原文: https://medium.com/@jorgecasar/how-to-use-web-components-with-angular-41412f0bced8 ------------- ...
- Web Components之Custom Elements
什么是Web Component? Web Components 包含了多种不同的技术.你可以把Web Components当做是用一系列的Web技术创建的.可重用的用户界面组件的统称.Web Com ...
- The state of Web Components
Web Components have been on developers’ radars for quite some time now. They were first introduced b ...
- Angular JS | Closure | Google Web Toolkit | Dart | Polymer 概要汇集
AngularJS | Closure | Google Web Toolkit | Dart | Polymer GWT https://code.google.com/p/google-web-t ...
- 通过Web Api 和 Angular.js 构建单页面的web 程序
通过Web Api 和 Angular.js 构建单页面的web 程序 在传统的web 应用程序中,浏览器端通过向服务器端发送请求,然后服务器端根据这个请求发送HTML到浏览器,这个响应将会影响整个的 ...
- angular custom Element 自定义web component
angular 自定义web组件: 首先创建一个名为myCustom的组件. 引入app.module: ... import {customComponent} from ' ./myCustom. ...
- Angular 2 for 2017 web full stack development
1 1 1 Angular 2 for 2017 web full stack development 1 1 https://angular2.xgqfrms.xyz/ https://ng2-he ...
- Polymer——Web Components的未来
什么是polymer? polymer由谷歌的Palm webOS团队打造,并在2013 Google I/O大会上推出,旨在实现Web Components,用最少的代码,解除框架间的限制的UI 框 ...
- 从HTML Components的衰落看Web Components的危机 HTML Components的一些特性 JavaScript什么叫端到端组件 自己对Polymer的意见
http://blog.jobbole.com/77837/ 原文出处: 徐飞(@民工精髓V) 搞前端时间比较长的同学都会知道一个东西,那就是HTC(HTML Components),这个东西名字很现 ...
随机推荐
- hive的hiveserver2模式启动不起来,发现Hadoop一直处于安全模式
hive的hiveserver2模式启动不起来,发现Hadoop一直处于安全模式 命令介绍 命令hadoop fs –safemode get 查看安全模式状态 命令hadoop fs –safemo ...
- xml 表格
设置单元格样式 <Style ss:ID="唯一id字符" ss:Name="单元格样式"> [内部通常用来设置 Alignment对齐.Font字 ...
- 一些基础的python小程序
1.求下列数奇偶分数: list1 = [1,2,3,4,5,6,7,8,9,10] # 先创建两个空列表 jishu = [] oushu = [] # 使用for循环迭代list1一一取出进行判断 ...
- java进程CPU高分析
JVM导致系统CPU高的常见场景: 内存不足,JVM gc频繁,一般会伴随OOMJVM某个线程死循环或者递归调用 定位和解决1.内存不足,gc频繁可参考我的这遍文章解决.https://blog.cs ...
- 使用tqdm实现下载文件进度条
1.获取下载链接 下载链接为:http://fastsoft.onlinedown.net/down/Fcloudmusicsetup2.5.5.197764.exe 2.使用tqdm实现 2.1.从 ...
- Codeforces 1240B. Sequence Sorting
传送门 分析题目发现如果把某个数 $x$ 往左移,那么之后所有小于 $x$ 的数也都要往左移 如果把 $x$ 往右移,那么之后所有大于 $x$ 的数也都要往右移 考虑我们首先一定有一个操作 $n$ 次 ...
- DVWA reCAPTCHA key: Missing
修改dvwa文件夹下文件config.inc.php change: $_DVWA[ 'recaptcha_public_key' ] = ' '; $_DVWA[ 'recaptcha_privat ...
- std::list保存大量数据时,类型即是无析构函数,该list析构时会占用大量CPU
std::list保存大量数据时,类型即是无析构函数,该list析构时会占用大量CPU
- Centos7:Solr4.10安装,配置与使用(tomcat环境)
配置jdk环境,安装tomcat 解压solr bin:是脚本的启动目录 contrib:第三方包存放的目录 dist:编译打包后存放目录,即构建后的输出产物存放的目录 docs:solr文档的存放目 ...
- 帝国cms 修改分页样式
帝国cms 修改分页样式(路径) /e/class/t_functions.php