[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),这个东西名字很现 ...
随机推荐
- 查找担保圈-step6-对被包含过的组进行清理,只保留未被包含过的组
USE [test] GO /****** Object: StoredProcedure [dbo].[p04_get_groupno_cleared] Script Date: 2019/7/8 ...
- SQLite进阶-11.Join
目录 JOIN 交叉连接 - CROSS JOIN 内连接 - INNER JOIN 外连接 - OUTER JOIN JOIN JOIN 子句用于结合两个或者多个数据表的数据,基于这些表之间的共同字 ...
- 【web性能优化】当用户输入网址后发生了什么?
简单叙述 这个过程可以大致分为两个部分:网络通信和页面渲染. 一.网络通信 互联网内各网络设备间的通信都遵循TCP/IP协议,利用TCP/IP协议族进行网络通信时,会通过分层顺序与对方进行通信.分层由 ...
- java实现spark常用算子之Repartitions
import org.apache.spark.SparkConf;import org.apache.spark.api.java.JavaRDD;import org.apache.spark.a ...
- 01 Go之环境搭建
1.1 Linux搭建Go环境 1.ssh远程登录Linux服务器,可选用iTerm.xshell ssh root@ip 2.建议配置好阿里云yum源.epel源 安装git yum install ...
- HttpClient的GET请求(post)请求
一.不带参数的GET请求 // 创建Httpclient对象 CloseableHttpClient httpclient = HttpClients.createDefault(); // 创建ht ...
- latex中文环境配置(针对北大模板,开题报告+中期答辩+毕业论文)
最近自己在忙着开题,中文环境真的是emm 以下只针对北大的毕业论文模板,至于其他的中文环境没有尝试 主要是用不同的latex编辑器会报不同的错误,当然我最后还是统一成了pdflatex,经过无数次尝试 ...
- java web中 8080端口号被占用的问题处理,终于明白了 Address already in use: JVM_Bind(端口冲突)
1.错误描述 2011-7-20 11:05:18 org.apache.catalina.core.StandardServer await严重: StandardServer.await: cre ...
- docker 批量删除含有同样名字的images
docker rmi --force $(docker images | grep doss-api | awk '{print $3}') docker rmi $(docker images | ...
- linux之网络命令
本文整理了在实践过程中使用的Linux网络工具,这些工具提供的功能非常强大,我们平时使用的只是冰山一角,比如lsof.ip.tcpdump.iptables等. 本文不会深入研究这些命令的强大用法,因 ...