angular在模板中使用属性引发Cannot read property 'xxx' of undefined

在使用ng2的过程中,发现模板中如下方式

<li *ngFor="let item of model">

{{item.name}}
</li>

不会又任何问题.

如果是一下未使用结构指令方式,直接使用组件的属性

<li >

{{model.name}}
</li>

就会报错null错误,一开始百思不得其解,后来搞明白,model是异步请求获取的数据,在定义的时候let mode:any 时是属于unde值,而这时组件模板已经开始渲染了,也就会引发异常,知道原因,这就好办了,又两种方式可以处理:

1.定义组件属性的时候初始化对象: let mode:any={};

2.在模板中使用ngIf指令:<li *ngIf="model">{{model.name}} </li>

以上两种方式均能保证组件模板在第一次初始化时不会因为null属性引用引发异常.

angular2在模板中使用属性引发Cannot read property 'xxx' of undefined的更多相关文章

  1. 解决Java中There is no getter for property XXX'XXX' in 'class XXX'的问题

    当你出现There is no getter for property XXX'XXX' in 'class XXX'时, 就是在你的这个类中没有找到你这个属性. 检查两个地方 1.你的返回值类型是否 ...

  2. wpf/Silverlight/wp中如何绑定模板中的属性

    <Style TargetType="{x:Type TabItem}" x:Key="EditorTabItemStyle"> <Sette ...

  3. ListBox项模板中绑定ListBoxItem属性的方法

    原文:ListBox项模板中绑定ListBoxItem属性的方法 <ListBox> <ListBox.ItemTemplate> <DataTemplate> & ...

  4. WPF之通过EventTrigger修改模板中元素的属性

    前言:对于此操作,我只想说是微软的神经,还是我的笨蛋.为什么EventTrigger就不能像Trigger那样直接设置Property以及Value就对属性进行操作,而必须要放一个Action,而默认 ...

  5. flask学习(十):模板中访问模型和字典的属性

    访问模型中的属性或者是字典,可以通过{{params.property}}的形式,或者是使用{{params['age']}}这样的形式

  6. ASP.NET Web API 2中的属性路由(Attribute Routing)

    如何启用属性路由并描述属性路由的各种选项? Why Attribute Routing? Web API的第一个版本使用基于约定的路由.在这种类型的路由中,您可以定义一个或多个路由模板,这些模板基本上 ...

  7. SMARTY模板中如何使用get,post,request,cookies,session,server变量

    {$smarty}保留变量不需要从PHP脚本中分配,是可以在模板中直接访问的数组类型变量,通常被用于访问一些特殊的模板变量.例如,直接在模板中访问页面请求变量.获取访问模板时的时间戳.直接访问PHP中 ...

  8. Javascript中prototype属性详解

    在典型的面向对象的语言中,如java,都存在类(class)的概念,类就是对象的模板,对象就是类的实例.但是在Javascript语言体系中,是不存在类(Class)的概念的,javascript中不 ...

  9. 走进AngularJs(二) ng模板中常用指令的使用方式

    通过使用模板,我们可以把model和controller中的数据组装起来呈现给浏览器,还可以通过数据绑定,实时更新视图,让我们的页面变成动态的.ng的模板真是让我爱不释手.学习ng道路还很漫长,从模板 ...

随机推荐

  1. python builtin列表

    Python Builtin function获得通过 python3 -c "import builtins;ff=open('test.txt','w');strlist=[(i+'\n ...

  2. Problem A: 字符的变化

    Description 定义一个Character类,具有: 1. char类型的数据成员. 2.构造函数Character(char). 3. Character toUpper():如果当前字符是 ...

  3. Qt的子窗口和父窗口阻塞问题

    在图形界面中,软件设计者通常需要将活跃窗口限制为一个.在某个窗口活跃时,它的父窗口被它挡住或者挡住一部分,这时候用鼠标去点击父窗口是没有作用的.问题的关键在于将子窗口设置模态: void MainWi ...

  4. 如何开发微信小程序学习

    文件中 project.config.json是开发者工具为我们自动生成的一个开发者工具的配置文件,主要是保存了一些我们对开发者工具的个性化配置. 一个微信小程序应用至少要有两个文件 一个是app.j ...

  5. 使用Selenium进行浏览器自动化操作记录

    一位经验丰富的同事交给了我一个任务:将20个IP地址添加到公司系统对应的目录下. 这个任务之前做过,并且数量是远不止20个,当时就学习Selenium并且使用Python3.6写了一个脚本用来自动化地 ...

  6. 第一模块 Python开发入门

    第一章 Python语法基础 变量的定义规范 一.声明变量 name = "Alex" 二.变量的定义规则 变量名只能是字母.数字或下划线的任意组合 变量名的第一个字符不能是数字 ...

  7. c++ complie link error 2019/2001

    1:没有将需要的文件添加到项目中,只是考到项目所在的目录了 2:没有添加 类导出 宏

  8. Asp.net中时间格式化的几种方法

    1. 数据控件绑定时格式化日期方法:<asp:BoundColumn DataField="AddTime" HeaderText="添加时间" Data ...

  9. 为什么 EXISTS(NOT EXIST) 与 JOIN(LEFT JOIN) 的性能会比 IN(NOT IN) 好

    前言 网络上有大量的资料提及将 IN 改成 JOIN 或者 exist,然后修改完成之后确实变快了,可是为什么会变快呢?IN.EXIST.JOIN 在 MySQL 中的实现逻辑如何理解呢?本文也是比较 ...

  10. PKU《程序设计》专项课程_递归汉诺塔问题

    取自coursera.org上公开课北京大学<C程序设计进阶> 递归调用注意的点 1.关注点放在求解的目标上,递推是,目标放在开头 2.找到第N次和第(N-1)次之间的关系,通项公式 3. ...