tip:数据的定义需要在对应ts中进行,调用在html中

  定义数组:

  ts中 public arr =["111","222","333"];

  html中

  <li *ngFor="let item of  arr">{{item}}</li>


指定数据类型

  ts中

  1. public list:any[]=["我是1号",“我是2号”,“我是3号”];
  2. public items:Array<any>=["我是1号",“我是2号”,“我是3号”];

  这两种方式可以任选其一都可以

  html中

    <li *ngFor = let item of list>{{item}}</li>  


定义数组(数组中存放对象)

  ts中:

  public userList:any=[

  {username:"rock",age:20},

  {username:"roy",age:"23"},

  {username:"luck",age:"214"}

]

html中

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

    <p>{{item.username}}</p><p>{{item.age}}</p>

  </li>


多重循环嵌套

在ts中  

public cars:any[]=[
      {cate:"宝马",
    list:[
      {name:"宝马X1",price:"20w"},
      {name:"宝马X2",price:"30w"},
      {name:"宝马X3",price:"40w"}
     ]
     },
         {
   cate:"奥迪",
   list:[
     {name:"奥迪Q1",price:"40w"},
     {name:"奥迪Q2",price:"50w"},
     {name:"奥迪Q3",price:"60w"}
    ]
  }
]

在HTML中

<div>
  <ul>
    <li *ngFor="let item of cars">
      <p>{{item.cate}}</p>
      <span *ngFor="let item of item.list">{{item.name}}--{{item.price}}</span>
    </li>
   </ul>
</div>

Ng的数组绑定的更多相关文章

  1. mvc数组绑定-jquery ajax

    var list=[];//数组 list[0]=1001; list[1]=1002; list[1]=1003; var json_data = { selected: list}; $.ajax ...

  2. EmberJs之数组绑定@each&[]

    写在前面 好长时间没有写博客了,昨天花了些时间又整理了下之前发布过的<Ember.js之computed Property>文章,并创建了一个测试代码库,花了些时间,希望能使用测试代码的方 ...

  3. asp.net mvc int[] 和 string[] 自定义数组绑定

    新建类,int[]数组模型绑定 using System; using System.Collections.Generic; using System.Linq; using System.Web; ...

  4. 给js创建的一个input数组绑定click事件

    <html> <body> <input type="button" name="input[]" value="按钮1 ...

  5. 使用C# .NET 将结构数组绑定到 Windows 窗体的方法

      本任务的内容 概要 要求 设计结构 向数组添加结构实例 将结构成员绑定到窗体控件 提供浏览数组的方式 分步示例 参考 概要 本文介绍如何向 Windows 窗体绑定结构数组. 该示例由一个 Win ...

  6. Spring MVC数组绑定

    需求:商品批量删除,用户在页面选择多个商品,批量删除. 关键:将页面选择(多选)的商品id,传到controller方法的形参,方法形参使用数组接收页面请求的多个商品id // 批量删除 商品信息 @ ...

  7. Repeater绑定数组并显示其值

    web开发中,尤其是对于数据展示,不得不说Repeater是一个万能的控件,而且使用也很方便. 在ASP.NET中将数组绑定到Repeater中请问如何在Repeater前台页面中显示该数组的值? s ...

  8. ASP.NET MVC数组模型绑定

    在ASP.NET MVC中使用Razor语法可以在视图中方便地展示数组,如果要进行数组模型绑定,会遇到索引断裂问题,如下示例: <input type="text" name ...

  9. MVC数组模型绑定

    ASP.NET MVC数组模型绑定   在ASP.NET MVC中使用Razor语法可以在视图中方便地展示数组,如果要进行数组模型绑定,会遇到索引断裂问题,如下示例: <input type=& ...

随机推荐

  1. Codeforces 832 D Misha, Grisha and Underground

    Misha, Grisha and Underground 题意:Misha 和 Grisha 是2个很喜欢恶作剧的孩子, 每天早上 Misha 会从地铁站 s 通过最短的路到达地铁站 f, 并且在每 ...

  2. CodeForces 507E Breaking Good 2维权重dij

    Breaking Good 题解:         2维权重dij, 先距离最短, 后改变最小.   在这个题中, 如果要改变最小, 则让更多的可用边放进来. 然后可以用pre存下关键边.   代码: ...

  3. 第 14 篇:交流的桥梁“评论功能”——HelloDjango 系列教程

    截止到目前为止我们的 django blog 文章展示部分,已经实现的"八九不离十"了.你以为本系列文章就要结束了吗?不能够!新的征程才刚刚开始,HelloDjango 系列文章刚 ...

  4. 2018阿里-研发工程师JAVA Software Engineer, Java

    岗位描述Job Description如果你想了解JAVA开发在阿里巴巴互联网生态系统中无与伦比的应用广度与深度: 如果你对基础技术感兴趣,你可以参与基础软件的设计.开发和维护,如分布式文件系统.缓存 ...

  5. 更改mac电脑图片默认存储位置

    1.创建存储位置screenshot 2.打开terminal 3.defaults write com.apple.screencapture location ~/Desktop/screensh ...

  6. Go语言基础之单元测试

    不写测试的开发不是好程序员.我个人非常崇尚TDD(Test Driven Development)的,然而可惜的是国内的程序员都不太关注测试这一部分. 这篇文章主要介绍下在Go语言中如何做单元测试和基 ...

  7. Linux下Mysql启动异常排查方案

    遇到Mysql启动异常问题,可以从以下几个方面依次进行问题排查: (1)如果遇到“Can't connect to local MySQL server through socket '/tmp/my ...

  8. Winform中在FastReport的PreviewControl预览控件中对report控件模板中控件值进行修改

    场景 FastReport安装包下载.安装.去除使用限制以及工具箱中添加控件: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/10 ...

  9. SqlServer2014怎样还原数据库

    场景 在SqlServer2014企业版上怎样进行数据库的还原,首先你得有一个其他数据 的备份文件. 实现 打开cmd,输入sql,打开SqlServer 2014 Management Studio ...

  10. js 手机号码正则表达式

    var chenkPhone=/^(0|86|17951)?(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57])[0-9]{8}$/var username=$ ...