angular ng-content
<p>
child works!
</p>
<ng-content></ng-content>
<app-child>
父组件投影
</app-child>
<p>
child works!
</p>
<ng-content select=".header"></ng-content> <ng-content select=".footer"></ng-content>
<app-child>
<div class="header">页头</div>
<div class="footer">页脚</div>
</app-child>
<div [innerHTML]='div1'></div>
import { Component } from '@angular/core'; @Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'app';
div1 = '<div>aaa</div>';
}
angular ng-content的更多相关文章
- [Angular] Configurable Angular Components - Content Projection and Input Templates
We are going to have a modal component: <au-modal > </au-modal> And we can pass default ...
- angular ng build --prod 打包报错解决方案
使用以下代码 就不报错了 ng build --prod --no-extract-license 打包命令 使用以下代码 就不报错了 ng build --prod --no-extrac ...
- angular ng指令
1.指令 ng-app,ng- 都是angular的指令系统ng-app: ng-app是angular的初始化,一个页面只能有一个ng-app,位置不限制.在页面上加入了这个执行,那么从当前的元素以 ...
- [Angular] Learn Angular Multi-Slot Content Projection
Now for au-modal component, we pass in tow component though contenct projection: <au-modal class= ...
- Docker+Nginx部署Angular
在部署Angular生产环境之前,需要电脑已经安装docker. 添加Dockerfile在已经完成的Angular项目的项目根目录下添加Dockerfile文件. Dockerfile文件内容: F ...
- VS Code直接调试Angular代码
安装VS Code扩展 安装Debugger for Chrome 安装Debugger for Firefox 配置Launch.json文件 Launch.json文件的创建和生成我们可以利用VS ...
- ng-template、ng-content、ng-container
https://www.jianshu.com/p/0f5332f2bbf8 ng-template.ng-content.ng-container三者应该是自定义组件需要经常用到的指令.今天咱们就来 ...
- Jquery使用ajax以及angularjs 动态模板加载并进行渲染
1. 源码 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <tit ...
- 在Visual Studio 2017中使用Asp.Net Core构建Angular4应用程序
前言 Visual Studio 2017已经发布了很久了.做为集成了Asp.Net Core 1.1的地表最强IDE工具,越来越受.NET系的开发人员追捧. 随着Google Angular4的发布 ...
- .Net Core应用框架Util介绍(一)
距离上次发文,已经过去了三年半,这几年技术更新节奏异常迅猛,.Net进入了跨平台时代,前端也被革命性的颠覆. 回顾 2015年,正当我还沉迷于JQuery + EasyUi的封装时,突然意识到技术已经 ...
随机推荐
- Laravel5 cookie和session设置 Cookie::queue()自动添加
Cookies Laravel会加密所有已创建的cookie信息,并附加上授权码,当客户端擅自修改cookie信息时,该cookie将被废弃,从而保证安全性. 获取一个指定的cookie值 $valu ...
- thinkphp中配置信息的二维数组设置与使用
有时候配置信息是二维数组 1.配置 <?php return array ( // 阿里大鱼短信配置 'dayu_appkey'=>'xxx', 'dayu_secretKey'=> ...
- 四、 kafka consumer 配置
consumer配置 #指明当前消费进程所属的消费组,一个partition只能被同一个消费组的一个消费者消费(同一个组的consumer不会重复消费同一个消息) group.id #针对一个part ...
- MFC调试的几个技巧
TCHAR pStr[] = _T("this is a test!"); void* p = (void*)pStr; TRACE(_T("pStr is %s\n&q ...
- python's thirty day for me 异常处理
---恢复内容开始--- 程序的异常:报错之后程序终止. 异常处理搭配使用: l = ['创建老师','创建学校'] while True: try: for num,item in enumerat ...
- 「小程序JAVA实战」小程序视图之细说数据绑定(13)
转自:https://idig8.com/2018/08/09/xiaochengxu-chuji-13/ 在前面的小节里面其实对数据绑定都有所了解了,在这次给老铁在好好说下数据绑定,看下它的方方面面 ...
- IDE 文件查找快捷键被占
快捷键 Ctrl+Shift+F 被搜狗输入法抢占了. 打开搜狗输入法里的快捷键设置,去掉,my ide is ok!
- 【转】VS 安全开发生命周期(SDL)检查
前面在学习使用google的protobuf时在VS2012中一直无法编译编译通过,经过查找一些资料原来发现,并不是protobuf的问题,而是自己在使用VS2012时,没有完全了解VS2012的强大 ...
- Hadoop Serialization -- hadoop序列化详解 (2)
回顾: 回顾序列化,其实原书的结构很清晰,我截图给出书中的章节结构: 序列化最主要的,最底层的是实现writable接口,wiritable规定读和写的游戏规则 (void write(DataOut ...
- Hadoop编码解码【压缩解压缩】机制详解(1)
想想一下,当你需要处理500TB的数据的时候,你最先要做的是存储下来.你是选择源文件存储呢?还是处理压缩再存储?很显然,压缩编码处理是必须的.一段刚刚捕获的60分钟原始视屏可能达到2G,经过压缩处理可 ...