angular2的ngfor ngif指令嵌套

ng2 结构指令不能直接嵌套使用,可使用<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>

　　

angular2的ngfor ngif指令嵌套的更多相关文章

  1. 浅谈Angularjs至Angular2后内置指令的变化

    一.科普概要说明 我们常说的 Angular 1 是指 AngularJS: 从Angular 2 开始已经改名了.不再带有JS,只是单纯的 Angular: Angular 1.x 是基于JavaS ...

  2. AngularJS指令嵌套时link函数执行顺序的问题

    今天研究指令嵌套时,发现子指令的link函数先于父指令的link函数执行. 这样和预想的顺序不一样. 也就是说,如果子指令的某个scope变量依赖于父指令传来的参数时,可能一直是undefinded比 ...

  3. angularJS中的ng-show、ng-if指令

    angularJS中的ng-show.ng-hide.ng-if指令都可以用来控制dom元素的显示或隐藏. 1. ng-show和ng-hide 根据所给表达式的值来显示或隐藏HTML元素.元素会渲染 ...

  4. --@angularJS--较复杂的指令嵌套demo——综合小实例：登陆界面

    1.index.html: <!DOCTYPE HTML><html ng-app="app"><head>    <title>c ...

  5. angular2路由之routerLinkActive指令

    angular2的routerLinkActive指令在路由激活时添加样式class .red{  color: red;}    <a routerLink="/user/login ...

  6. Angular2 关于*ngFor 嵌套循环

    在项目开发中拿到的数据是这样的,要循环遍历出来.可是在ng2中好像不能直接遍历Object datas: any = [ { num: 1, date: "2017-04-12", ...

  7. angualrJS（mvc）指令嵌套使用的一些问题

    angular的指令拥有一个独立作用域的概念. 一般定义指令的形式: define(['app'],function(mianapp){ mainapp.directive("tlmsAol ...

  8. Angular2 内置指令 NgFor 和 NgIf 详解

    http://www.jb51.net/article/89781.htm 在这一章节中,我们来学习如何使用Angular2来展示数据,以及如何使用它的内置指令NgFor和NgIf 首先要确保你有一个 ...

  9. angular2 *ngIf与[hidden]对比<转>

    在AngularJS 1中,如果想切换DOM元素的显示状态,估计你会用AngularJS 1内置的指令如:ng-show 或者 ng-hide: AngularJS 1示例: <div ng-s ...

随机推荐

  1. MySQL ANALYZE TABLE

    Analyze Table MySQL 的Optimizer(优化元件)在优化SQL语句时,首先需要收集一些相关信息,其中就包括表的cardinality(可以翻译为“散列程度”),它表示某个索引对应 ...

  2. __autolaod

    转载自:https://blog.csdn.net/baidu_30000217/article/details/52743139 php实现类文件自动载入有两种办法: 魔术方法:__autoload ...

  3. Python库，让你相见恨晚的第三方库

    环境管理 管理 Python 版本和环境的工具 p – 非常简单的交互式 python 版本管理工具.pyenv – 简单的 Python 版本管理工具.Vex – 可以在虚拟环境中执行命令.virt ...

  4. USB眼图

    /********************************************************************** * USB眼图 * 说明: * 对于USB眼图,并不是很 ...

  5. 【err】VIDEOIO ERROR: V4L: index 0 is not correct!Unable to connect to camera

    前言 新到手一块板子,程序编译成功之后,运行出现错误,不能连接到摄像头. 问题 VIDEOIO ERROR: V4L: index is not correct! Unable to connect ...

  6. 九度OJ-1001-A+B矩阵-有些小技巧

    题目1001:A+B for Matrices 时间限制:1 秒 内存限制:32 兆 特殊判题:否 提交:22974 解决:9099 题目描述: This time, you are supposed ...

  7. thrift使用案例

    参考资料:http://www.ibm.com/developerworks/cn/java/j-lo-apachethrift/ 首先是定义thrift IDL接口,如下(SunTelTc.thri ...

  8. python三大框架之一flask中cookie和session的相关操作

    状态保持 Cookie cookie 是指某些网站为了 辨别  用户身份,进行会话跟踪而储存在用户本地的数据(通常会经过加密),复数形式是 coolies. cookie是由服务器端生成,发送给客户端 ...

  9. K - FatMouse and Cheese

    最近一直在写dp,然后别的就啥也不管了(wtcl),很明显的最简单的搜索题竟然卡了,一开始的思路是每一个格子都只能是从四周的格子转化过来的,只要找到四周最大的那个那么dp[i][j]=max+a[i] ...

  10. ubuntu shell插件

    1. NetSpeed 在状态栏显示当前网速 2. Screenshot Tool 同样在 Ubuntu 18.04 之前我们使用 Shutter,但在Ubuntu 18.04 Shutter的托盘图 ...