Angular v2不支持同一元素上使用多个结构指令。
  一种解决方法,使用<ng-container>,允许为每个结构指令使用单独元素的元素,但不会将其标记为DOM。

<ng-container *ngIf="show">
<div *ngFor="let thing of stuff">
{{log(thing)}}
<span>{{thing.name}}</span>
</div>
</ng-container>

  

另外一段示例代码

<ul>
<ng-container *ngFor="let item of lists">
<div class="thumb p-date" *ngIf="item.picurl">
<a href="# "><img src="{{item.picurl}} " alt=" " style="width:79px;height: 70px; "></a>
</div>
</ng-container>
</ul>

ngIf和ngFor共用的更多相关文章

  1. Angular2学习笔记——NgModule

    在Angular2中一个Module指的是使用@NgModule修饰的class.@NgModule利用一个元数据对象来告诉Angular如何去编译和运行代码.一个模块内部可以包含组件.指令.管道,并 ...

  2. Angular2笔记:NgModule

    Angular的模块的目的是用来组织app的逻辑结构. 在ng中使用@NgModule修饰的class就被认为是一个ng module.NgModule可以管理模块内部的Components.Dire ...

  3. Angular2 指令

      1. 指令说明 Angular2 指令是构成Angular2应用程序的重要组成部分,指令主要用来对模板的标签或者元素附加一些新的特性或者功能,改变一个 DOM 元素的外观或行为,Angular2指 ...

  4. Angular 2.0 从0到1 (四)

    第一节:Angular 2.0 从0到1 (一)第二节:Angular 2.0 从0到1 (二)第三节:Angular 2.0 从0到1 (三)第四节:Angular 2.0 从0到1 (四)第五节: ...

  5. Angular2经典文章集锦

    Angular Metadata 等基础知识 http://www.jianshu.com/p/aeb11061b82c Metadata告诉Angular如何处理一个类,只有我们将它通告给Angul ...

  6. Angular学习笔记(2)——TODO小应用

    Angular学习笔记(2)--TODO小应用 1. 写在前面 之前我们跑了Angular的Hello World,你是不是对它有点感觉了呢?这一篇将结合一个TODO程序来继续学习Angular的用法 ...

  7. Angular2 - Starter - Routes, Route Resolver

    在基于Angualr的SPA中,路由是一个很重要的部分,它帮助我们更方便的实现页面上区域的内容的动态加载,不同tab的切换,同时及时更新浏览器地址栏的URN,使浏览器回退和前进能导航到历史访问的页面. ...

  8. Angular2的模块架构浅谈

    引言angular2相比1引入了更完善的模块系统,回忆ng1的应用中通常在页面的html标签或body标签中添加ng-app节点,值为应用的模块名,整个应用都将围绕这个模块来展开,到了ng2,模块概念 ...

  9. Angular4.0.0正式版发布

    来源于angular4.0.0发布时的公告,译者:niithub 原文发布时间:Thursday, March 23, 2017 翻译时间:2017年3月24日 angular4.0.0正式版现在可以 ...

随机推荐

  1. 【shell编程】之基础知识-语法

    一.shell变量 1.定义变量 定义变量时,变量名不加美元符号($,PHP语言中变量需要), 如: your_name="runoob.com" 注意,变量名和等号之间不能有空格 ...

  2. python——SMTP发送简单邮件

    [root@localhost python]# cat smtp.py import smtplib import string from email.mime.text import MIMETe ...

  3. skipper filter 扩展开发

    skipper 的扩展包含filter类型的,以及Predicates ,当然script(lua)脚本也是 这次主要是filter类型的开发 filter 接口约定 格式 filter 至少需要包含 ...

  4. 数据驱动 vs 关键字驱动:对搭建UI自动化测试框架的探索

    UI自动化测试用例剖析 让我们先从分析一端自动化测试案例的代码开始我们的旅程.以下是我之前写的一个自动化测试的小Demo.这个Demo基于Selenium与Java.由于现在Selenium在自动化测 ...

  5. First 1

    一,Python介绍 1,python的出生与应用 python的创始人为吉多·范罗苏姆(Guido van Rossum).1989年的圣诞节期间,吉多·范罗苏姆(中文名字:龟叔)为了在阿姆斯特丹打 ...

  6. tomcat源码阅读之默认连接器

    默认连接器 一.UML图: 1.所有的连接器都要实现Connector接口,必须创建Request对象和Response对象,httpConnector作为默认连接器,肯定也是要实现Connector ...

  7. CentOS6.5系统下RPM包安装MySQL5.6(转)

    1.查看操作系统相关信息. [root@linuxidc ~]# cat /etc/issue CentOS release 6.5 (Final) Kernel \r on an \m [root@ ...

  8. dojo:如何用MultiSelect实现类似ListBox风格的FromTo功能

    欲实现的功能如下图: 主要要解决的问题包括两个方面: 一个是MultiSelet初始化的工作,一个是FromTo功能按钮的实现.这主要是因为MultiSelect控件是存储无关的,并不像Select或 ...

  9. java中三种for循环之间的对比

    普通for循环语法: for (int i = 0; i < integers.length; i++) { System.out.println(intergers[i]); } foreac ...

  10. EXCEL 将网络图片地址插入为锁定的图片单元格宏

    Sub InsertPic2(ByVal 图片链接 As String, ByVal 插入图片表名 As String, ByVal 插入图片单元格地址 As String) On Error Res ...