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. 【HAOI2015】 T1

    为什么感觉越来越迷了X. X 原题: 有一棵点数为 N 的树,树边有边权.给你一个在 0~N 之内的正整数 K,你要在这棵树中选择 K 个点,将其染成黑色,并将其他的N-K 个点染成白色.将所有点染色 ...

  2. centos7安装的mysql无法启动(mysql daemon failed to start)

    不知道是什么原因,启动mysql时一直报这个错误,卸载重装mysql也没用 后来看到网上有人说,执行命令mysql_install_db就可以了 一试还真的行

  3. dive 方便的观察容器各层信息的工具

      dive 是一个方便的观察容器各层信息的工具,同时也集成了容器构建命令,方便我们在构建容器 镜像的同时查询镜像各层的变动信息 安装 mac 系统,可以按照自己的系统选择安装方式 wget http ...

  4. python通过xlwt模块直接在网页上生成excel文件并下载

    urls: from django.conf.urls import url, include from . import views urlpatterns = [ ... url(r'^domai ...

  5. Oracle和SQL语句的优化策略(基础篇)

    转载自: http://blog.csdn.net/houpengfei111/article/details/9245337 http://blog.csdn.net/uniqed/article/ ...

  6. position 分层固定在屏幕某位置

    很多网站我们看到在屏幕右下角有一个,返回顶部,始终在那儿,还有些网站顶部菜单栏永远也是固定的不动,就是通过今天学习的position来做的. 在style中加入 positon:fixed;top 0 ...

  7. oracle sql 添加、修改数据库操作方式

    年龄大了,写程序总记不住.记录一下格式: private const string SQL_INSTERT = @"INSERT INTO QS_ROOM_QUEUE (QUEUEID,RO ...

  8. Scrapy环境安装

    开始安装前,建议安装Visual C++ 2015 Build Tools,否则会一直出现如下提示: 下载地址:http://landinghub.visualstudio.com/visual-cp ...

  9. WCF类型共享技巧【转载】

    调用过WCF服务的同学可能都会遇到这样的问题,同一个实体类型,不同的服务Visual Studio生成了不同的版本,例如Service1.User和Service2.User,对于C#来说,这是两个不 ...

  10. Xshell5 评估过期,需要采购,不能使用

    Xshell5 评估过期,需要采购,不能使用 标签: Xshell linux 2017年10月10日 13:13:1029507人阅读 评论(9) 收藏 举报 版权声明:本文为博主原创文章,未经博主 ...