ng-container本身不创建任何html代码,相当于一个容器。

 

  <ng-container *ngFor="let item of dataSource;let i=index">
<div *ngIf="i%2==0">{{item.name}}</div>
</ng-container>

使用 ngTemplateOutlet 指令创建动态模板

<ng-container *ngTemplateOutlet="loading"></ng-container>
<ng-template #loading>
<div>loading</div>
</ng-template>

Angular ng-container ng-template 用法的更多相关文章

  1. [Angular 2] Set Values on Generated Angular 2 Templates with Template Context

    Angular 2 templates have a special let syntax that allows you to define and pass a context when they ...

  2. angular 2 - 001 ng cli的安装和使用

    angular cli 创建项目和组件 ng new my-app --skip-install cd my-app cnpm install ng serve localhost:4200 angu ...

  3. ng 1.2 ng-bind-html 用法

    使用ng-bind-html渲染html字符串时需要在控制器外注册$sec 过滤器 //过滤器渲染html字符串 app.filter('to_trusted',['$sce',function($s ...

  4. [Angular] Test Container component with async provider

    The main idea for testing contianer component is to make sure it setup everythings correctlly. Call ...

  5. Angular JS中$timeout的用法及其与window.setTimeout的区别

    $timeout的用法 angular.js的$timeout指令对window.setTimeout做了一个封装,它的返回值是一个promise对象.当定义的时间到了以后,这个promise对象就会 ...

  6. C++ primer里的template用法

    来源:http://c.chinaitlab.com/cc/ccjq/200806/752604_2.html --  template 的用法    在程序设计当中经常会出现使用同种数据结构的不同实 ...

  7. Go标准库:Go template用法详解

    本文只介绍template的语法和用法,关于template包的函数.方法.template的结构和原理,见:深入剖析Go template. 入门示例 以下为test.html文件的内容,里面使用了 ...

  8. angular中的子路由用法

    Angular ui-route的用法 引入angular和使用angular子路由时需要的依赖模块angular-ui-route.js.并且在html中将路由要插入的位置写上.而在js部分中和an ...

  9. angular directive 的controllerAs的用法

    原文: https://stackoverflow.com/questions/31857735/using-controlleras-with-a-directive --------------- ...

  10. Angular6之ng build | ng build --aot | ng build --prod 差异

    由于写了大半年的项目终于要告一段落并且即将进行第二阶段优化开发,emmm 基础版本已经二十多个模块了,必不可少的优化是很重要的,尽管项目上使用多层嵌套懒加载,但是在首屏加载的时候,任然很慢啊,因为一直 ...

随机推荐

  1. 三星首款折叠屏手机Galaxy Fold上架中国官网

    2 月 28 日,在三星 Galaxy S10 系列新品发布会上,备受期待的三星首款可折叠屏手机 Galaxy Fold 也在中国正式亮相.目前,Galaxy Fold 已正式上架三星中国官网,可以预 ...

  2. 3 ~ express ~ 静态文件托管

    静态资源文件处理 (一)设置静态资源托管目录 /* *  当 用户访问的 url 以 /public 开始 ,那么直接返回对应 __dirname + '/public' 下的文件  . 注意是双下划 ...

  3. C++ STD Gems06

    generate.generate_n.sample.iota #include <iostream> #include <vector> #include <strin ...

  4. [Python3] RSA的加解密和签名/验签实现 -- 使用pycrytodome

    Crypto 包介绍: pycrypto,pycrytodome 和 crypto 是一个东西,crypto 在 python 上面的名字是 pycrypto 它是一个第三方库,但是已经停止更新,所以 ...

  5. 文献阅读 - MonoLoco与关于Camera Matrix的笔记

    目录 概览 HighLights Camera Intrinsic Matrix 笔记 Intrinsic Matrix Task-Error - 不确定性任务下确界的计算 输出假设的Laplace分 ...

  6. oracle数据删除恢复

    insert into 表名 select * from 表名 as of timestamp to_Date('2017-07-20 10:00:00', 'yyyy-mm-dd hh24:mi:s ...

  7. 吴裕雄--天生自然JAVA SPRING框架开发学习笔记:Spring实例化Bean的三种方法

    在面向对象的程序中,要想调用某个类的成员方法,就需要先实例化该类的对象.在 Spring 中,实例化 Bean 有三种方式,分别是构造器实例化.静态工厂方式实例化和实例工厂方式实例化. 构造器实例化 ...

  8. 干货 | 京东云Kubernetes集群+Traefik实战

    摘要 Traefik支持丰富的annotations配置,可配置众多出色的特性,例如:自动熔断.负载均衡策略.黑名单.白名单.所以Traefik对于微服务来说简直就是一神器. 利用Traefik,并结 ...

  9. protobuf 的enum与string转换

    c/c++ enum 介绍 说起c/c++ 的enum,比起python 真的是方便简洁 enum type{ type1 = 0, type2 } enum的元素对应的int 默认从0 开始依次增加 ...

  10. vue组件传值 part2

    非父子组件传值 轻量级 视图层框架 复杂组件间传值,引进其他的工具或者设计模式 1.vuex 2.总线机制 //main line 1.在main.js中注册全局的bus Vue.prototype. ...