angular 动态组件

2023-11-01

angular动态组件,官方文档有详细介绍,这里仅标记几点以备后记:

1、宿主指令:用于动态组件的显示。指令的核心是注入的ViewContainerRef 接口

<ng-template my-derective></ng-template>

2、ComponentFactoryResolver和ViewContainerRef接口:

ComponentFactoryResolver接口提供组件解析功能:
const component = this.c omponentFactoryResolver. resolveComponentFactory(XXX component);
V iewContainerRef 接口提供组件创建功能,返回组件实例:
this.component = this. V iewContainerRef . createComponent( component); //this.component 为 ComponentRef对象
his.component.instance.xxx = ...; 组件属性赋值


3、对应的模块中加入元数据:

entryComponents:{
XXX1component,
XXX2component,
...
}


本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

angular 动态组件 的相关文章

  • Vue-cli的安装与配置

    Node的下载与安装 工欲善其事必先利其器 在搭建vue的开发环境之前 一定一定要先下载node js vue的运行是要依赖于node的npm的管理工具来实现 1 首先我们进入到node的官网 https nodejs org zh cn
  • [Vue warn]: Cannot find element: #app

    解决方案 js在html页面头部引入的原因 自定义js文件要最后引入 因为要先有元素id vue才能获取相应的元素
  • web前端基础:HTML文字和段落标签

    标题标签 h1 h1 h6 h6 段落标签 p p align对齐属性值 值 描述 left 左对齐 right 右对齐 center 居中对齐 justify 对行进行伸展 每行可以有相等的长度 列表标签 有序列表 ol li 列表项 l
  • 2020web前端面试整理

    背景 2020年是比较特殊的一年 由于新冠影响导致很多事情发生了变化 同时也改变了人们的一些常规习惯 就拿换工作来说 为了减少大家的出行和接触 线上视频 电话面试成了趋势 但是万变不离其宗 技术才是王道 下面是个人近期的一些面试经验和需要大
  • ajax请求不能下载文件

    最近在做文件下载 后台写了个控制层 直接走进去应该就可以下载文件 各种文件图片 excel等 但是起初老是下载失败 并且弹出下面的乱码 前台请求代码 fileexcel unbind click bind click function al
  • Html页面内引入抽取出来的Html,js,css示例

    在写纯Html网站的时候 每个页面的头部菜单 js css和底部说明都是同样的 有的时候你要改 就要一个一个的去改 通过下面方法将这些相同的抽取出来 方便后期维护 希望能帮到你 在applyBusiness html页面引入公共页头head
  • VUE element-ui之el-popover弹出框在局部全屏下不显示问题及弹框、小箭头背景修改

    问题 局部全屏后el popover弹出框失效 解决方法
  • CSS transform属性的简单应用——双开门动画效果

    1 效果演示 CSS transform属性有许多效果 平移 旋转 缩放等 这里简单应用平移效果 实现双开门动画 以下为效果图 2 设计思路 设置一张居中的需要隐藏的底图 设置封面图 平分成左右两部分 鼠标悬浮在封面图上 触发 开门 效果
  • html登录页面

    效果图 html代码 index html
  • ES6语法知识点

    目录 let const 常用 暂时性死区 const 建议 箭头函数 常用 建议 iterator迭代器 解构赋值 常用 建议 剩余 扩展运算符 常用 扩展运算符 剩余运算符 在对象中使用扩展运算符 建议 对象属性 方法简写 常用 对象属
  • Web前端——Javascript复习(数组)

    1 数组 1 程序 数据结构 算法 一个好的数据结构 可极大提高程序的执行效率 相关的多个数据应集中存储 管理 分类和排序 2 数组概念 一组连续的变量组成的集合 批量管理多个数据 创建 2 1 var 变量名 2 2 var 变量名 值1
  • uniapp的那些坑

    1 selectedColor不起作用 1 查看位置是否写对 与lis同级 2 是否为16进制 selectedColor写的rgb不支持 3 是否被其他样式覆盖 其他地方也设置过selectedColor 可以全局搜索一下 2 pages
  • 父容器display:flex后,子元素的内部元素height:100%无效解决方法

    父容器display flex后 子元素的内部元素height 100 无效解决方法 解救办法 父类容器position relative 子元素 position absolute width 100 height 100 效果图 代码如
  • 20最佳代码审查工具-专门为开发人员准备

    程序员总是面临最后期限的压力和很多延误软件设计相当不稳定 整个产品是不稳定的 这种不稳定性的设计软件的原因是 它是不能正常测试 来的工作代码审查工具 的代码审查工具可以帮助web开发人员指出他们哪些区域的程序代码是错误的也可能有机会是不正确
  • laravel路由

    路由 在laravel中 定义路由的地方在routes web php文件中 在使用laravel前必须先定义路由 然后才能在浏览器中访问 routes文件夹中还有一个api php 用于定义api路径 最简单的路由 Route get f
  • HTML、CSS、JavaScript分别实现什么功能?

    学习Web前端开发基础技术需要掌握 HTML CSS JavaScript 那么这三个都是分别实现什么功能的呢 下面和小编一起来看看吧 一 HTML是网页内容的载体 内容就是网页制作者放在页面上想要让用户浏览的信息 可以包含文字 图片 视频
  • uni-app项目中使用scss语法

    最近正在学习uni app开发 我先把文档浅略翻了遍 发现组件和接口几乎都是按照微信小程序走 但是视图层上的语法又是按照vue的语法走的 所以开发过程一定要注意这点 然后我想在uni app项目中使用scss语法 但是具体怎么安装呢 历经曲
  • 探索CSS:从入门到精通Web开发(二)

    前言 当我们谈论网页设计和开发时 CSS 层叠样式表 无疑是其中的重要一环 作为HTML的伴侣 CSS赋予网页以丰富的样式和布局 使得网站看起来更加吸引人并且具备更好的可读性 本书将通过一系列深入浅出的方式 带你从入门到精通CSS 探索We
  • <a>标签的超链接前面会自动加上当前(网站)地址

    当前 网站 地址是 fyh com 在代码里写 a 标签时 会自动在链接前添加 fyh com 例如写如下代码 a href www baidu com baidu a 在浏览器中点击链接会跳转至 fyh com www baidu com
  • 第8章 多媒体嵌入

    学习目标 了解视频 音频嵌入技术 能够总结HTML5视频 音频嵌入技术的优点 了解常用的视频文件格式和音频文件格式 能够归纳HTML5支持的视频和音频格式 掌握HTML5中视频的嵌入方法 能够在HTML5页面中添加视频文件 掌握HTML5中

随机推荐

  • 数字游民让你实现边旅游边工作

    一篇标题是 中国数字游民放弃大城市 当起背包客寻求好去处 的报告吸引了我的注意 中国正赶上一种全球性潮流 许多技术熟练的从业者选择更便宜 风景更宜人的工作场所长期居住 这种人被称作 数字游民 这篇报导的摘要是这样描述的 一天的辛苦工作之后
  • [docker] 在需要使用opencv的时候常遇到的缺少动态链接库问题

    问题 当import cv2时出现 ImportError 缺少动态链接库 libgthread 2 0 so 0 libSM so 6 libXrender so 1 libXext so 6 等等 解决方法 apt get update
  • 吴恩达老师深度学习视频课笔记:人脸识别

    什么是人脸识别 人脸验证和人脸识别的区别 如下图 One shot learning 人脸识别所面临的挑战就是需要解决一次学习 one shot learning 问题 这意味着在绝大多数人脸识别应用中你需要通过单单一张图像或者单单一个人脸
  • Idea中快速找到springboot项目和springcloud项目的启动引导类

    一 打开idea下方的service 可以通过alt 8快速打开service 二 单击Add servrice 三 单击Run Configuration Type 四 找到springboot 五 springboot下面就会显示所有的
  • Android(Java)开发之获取BLE广播包(扫描后获取:广播数据+扫描应答数据+RSSI)

    一 安卓BLE的广播包数据从哪获取 通常 安卓APP读写BLE设备的数据都是建立连接后通过GATT获取或修改 但是 BLE设备向外广播时本身会携带一部分有用信息 如将传感数据存放到广播包的自定义数据段 最近接触的一个iBeacon Eddy
  • nginx部署dist包

    第一步 下载nginx压缩包 1 nginx官网下载 gt 点我下载nginx 2 使用wget命令下载 wget c https nginx org download nginx 1 20 1 tar gz 注意 这一步最好在自己的目标目
  • unity DOtween制作连续动画和部分小坑

    一 过程简介 这里首先你需要会普通的用代码做Dotween的动画 这里我们只需要学习如何组合起来 原理 DOtween里面带了一个功能叫做队列 可以连续做动画 需要写代码 基本过程 1 它和平时声明其他东西一样 别人是Int i 这个是Se
  • Oracle表空间及日志查询

    1 查看表空间的名称及大小 SELECT t tablespace name round SUM bytes 1024 1024 0 ts size FROM dba tablespaces t dba data files d WHERE
  • 逆序对计数问题 (python实现)

    本题见于算法导论第三版习题2 4 题设 对于一个序列a1 a2 a3 an 若存在i j 使得i
  • SpringBoot+Redis分布式锁:模拟抢单场景

    本篇不涉及到的redis环境搭建 快速搭建个人测试环境 这里建议使用docker 本篇内容节点如下 1 jedis的nx生成锁 2 如何删除锁 3 模拟抢单动作 10w个人开抢 jedis的nx生成锁 对于java中想操作redis 好的方
  • python实现并行的方法

    在 Python 中 可以使用多种方法来编写并行程序 使用 Python 的多线程模块 threading 可以创建多个线程来并行执行任务 例如 import threading def my function arg Do somethi
  • JS改变input的value值不触发onchange事件解决方案(超简版)

    监听js改变input的值触发的onchange事件 inpstart attr value inpend 0 value 当 我们像上面这样给一个input赋值时 由于onchange时间对input框不起作用 大家首先会想到使用 oni
  • RabbitMQ之延迟队列

    1 概念 延时队列 队列内部是有序的 最重要的特性体现在它的延时属性上 延时队列中的元素是希望再指定时间到了以后或之前取出和处理 简单来说 延时队列就是用来存放需要在指定时间被处理的元素的队列 2 使用场景 订单在十分钟之内未支付则自动取消
  • 显卡天梯图2021年9月新版

    显卡是现在电脑用户非常看重的一个特点 一款显卡的好坏对游戏体验的好坏有着决定性的作用 今天就给你们带来了显卡天梯图最新高清完整版20219月的分享 那么接下来就跟着小编一起来看看显卡天梯图吧 显卡天梯图2021年9月份 显卡又称显示卡 Vi
  • flask迁移数据库时关于枚举字段使用中文报错

    模型类 class Goods CRUDMixin BaseModel db Model tablename goods spu id db Column db Integer primary key True type db Column
  • Java016——Java输入输出语句

    一 输出语句 Java常用的输出语句有三种 1 System out println 换行输出 输出后会自动换行 示例 System out println Hello System out println World 输出 Hello W
  • 填充数据合并单元格_【Excel】为合并单元格填充序号

    戳蓝字 Office随身学 关注我们哦 在表格中填充序号 我们一般使用拖动填充柄的方式 有时为了表格的简洁美观 在表格中经常要对单元格进行合并 可是如果要在合并的单元格中还使用这种方法的话 序号就会出现问题 Excel 会提示你所有合并单元
  • python新手入门代码-介绍十个Python小案例,新手入门就在这里

    案例一 排列组合 要求 将4个数字可能组成的所有互不相同且无重复数字的排列组合列出 注意 很多人学Python过程中会遇到各种烦恼问题 没有人帮答疑容易放弃 为此小编建了个Python全栈免费答疑 裙 七衣衣九起起巴而五 数字的谐音 转换下
  • SDIO DRIVER

    SDIO 卡 SDIO 卡是在 SD 内存卡接口的基础上发展起来的接口 SDIO 接口兼容以前的 SD 内存卡 并且可以连接 SDIO 接口的设备 目前根据 SDIO 协议的 SPEC SDIO 接口支持的设备总类有蓝牙 网卡 电视卡等 S
  • angular 动态组件

    angular动态组件 官方文档有详细介绍 这里仅标记几点以备后记 1 宿主指令 用于动态组件的显示 指令的核心是注入的ViewContainerRef 接口