ng2中的ng-content用法
用途:1.ng-content用于在组件中嵌入内容
2.ng-content可以在组件中嵌入模板代码,方便定制可复用的组件
select属性支持css选择器,如"#id",".class",["name"="value"]等
eg:父组件html内容为:
<app-child>
<div class="left">123456</div>
<div class="right">654321</div>
</app-child> <--注:这里的app-child为可复用的组件模板的选择器-->
可复用的子组件模板为:
<div style="font-size:20px;">
<ng-content select=".left"></ng-content>
</div>
<div style="color:red;">
<ng-content select=".right"></ng-content>
</div>
那么页面上就会显示:

ng2中的ng-content用法的更多相关文章
- 1:CSS中一些@规则的用法小结 2: @media用法详解
第一篇文章:@用法小结 第二篇文章:@media用法 第一篇文章:@用法小结 这篇文章主要介绍了CSS中一些@规则的用法小结,是CSS入门学习中的基础知识,需要的朋友可以参考下 at-rule ...
- (转)解析PHP中ob_start()函数的用法
本篇文章是对PHP中ob_start()函数的用法进行了详细的分析介绍,需要的朋友参考下 ob_start()函数用于打开缓冲区,比如header()函数之前如果就有输出,包括回车/空格/换行 ...
- ES6中Set 和 Map用法
JS中Set与Map用法 一.Set 1.基本用法 ES6 提供了新的数据结构 Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. Set 本身是一个构造函数,用来生成 Set 数据结构. ...
- React中Props 和 State用法
React中Props 和 State用法 1.本质 一句话概括,props 是组件对外的接口,state 是组件对内的接口.组件内可以引用其他组件,组件之间的引用形成了一个树状结构(组件树),如果下 ...
- STL中的Vector相关用法
STL中的Vector相关用法 标准库vector类型使用需要的头文件:#include <vector>. vector 是一个类模板,不是一种数据类型,vector<int> ...
- Python中int()函数的用法浅析
int()是Python的一个内部函数 Python系统帮助里面是这么说的 >>> help(int) Help on class int in module __builti ...
- 详解 javascript中offsetleft属性的用法(转)
详解 javascript中offsetleft属性的用法 转载 2015-11-11 投稿:mrr 我要评论 本章节通过代码实例介绍一下offsetleft属性的用法,需要的朋友可以做一 ...
- Java中的Socket的用法
Java中的Socket的用法 Java中的Socket分为普通的Socket和NioSocket. 普通Socket的用法 Java中的 ...
- ecshop中foreach的详细用法归纳
ec模版中foreach的常见用法. foreach 语法: 假如后台:$smarty->assign('test',$test); {foreach from=$test item=list ...
- matlab中patch函数的用法
http://blog.sina.com.cn/s/blog_707b64550100z1nz.html matlab中patch函数的用法——emily (2011-11-18 17:20:33) ...
随机推荐
- 【Java并发编程实战】—–“J.U.C”:ReentrantLock之二lock方法分析
前一篇博客简介了ReentrantLock的定义和与synchronized的差别,以下尾随LZ的笔记来扒扒ReentrantLock的lock方法.我们知道ReentrantLock有公平锁.非公平 ...
- 【BZOJ1604】[Usaco2008 Open]Cow Neighborhoods 奶牛的邻居 Treap+并查集
[BZOJ1604][Usaco2008 Open]Cow Neighborhoods 奶牛的邻居 Description 了解奶牛们的人都知道,奶牛喜欢成群结队.观察约翰的N(1≤N≤100000) ...
- 线程(while 和 if 剖析)
那存钱取钱为例: 要求实现一次存一次取的操作 不可出现连续存或连续取: 如果只有存钱和取钱各自只有一个线程在操作使用 if 的话可以满足要求: package com.thread; /** * 模拟 ...
- 九度OJ 1145:Candy Sharing Game(分享蜡烛游戏) (模拟)
时间限制:1 秒 内存限制:32 兆 特殊判题:否 提交:248 解决:194 题目描述: A number of students sit in a circle facing their teac ...
- 九度OJ 1007:奥运排序问题 (排序)
时间限制:1 秒 内存限制:32 兆 特殊判题:否 提交:7344 解决:1568 题目描述: 按要求,给国家进行排名. 输入: 有多组数据. 第一行给出国家数N,要求排名的国家数M,国家号从0到N- ...
- Android笔记之ViewModel的使用示例
依赖 implementation 'android.arch.lifecycle:extensions:1.1.1' implementation 'com.squareup.retrofit2:r ...
- 《Linux 鸟哥私房菜》 第一部分 Linux文件、目录与磁盘格式
1.Linux就是内核层与系统调用接口层这2层.
- 小程序开发之xxx is not defined
遇到问题 在小程序开发中直接在函数中调用data中的变量直接赋值给新的变量,就会出现如下错误 VM33895:1 thirdScriptErrorapaymoney is not defined; [ ...
- iOS中常见的设计模式(MVC/单例/委托/观察者)
关于设计模式这个问题,在网上也找过一些资料,下面是我自己总结的,分享给大家 如果你刚接触设计模式,我们有好消息告诉你!首先,多亏了Cocoa的构建方式,你已经使用了许多的设计模式以及被鼓励的最佳实践. ...
- 解决使用mybatis做批量操作时发生的异常:Parameter '__frch_item_0' not found. Available parameters are [list] 记录
本文主要描述 使用mybatis进行批量更新.批量插入 过程中遇到的异常及总结: 首先贴出使用批量操作报的异常信息: java.lang.RuntimeException: org.mybatis.s ...