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. CF #535 (Div. 3) E2 Array and Segments (Hard version) 利用线段树进行区间转移

    传送门 题意:    有m个区间,n个a[ i ] , 选择若干个区间,使得整个数组中的最大值和最小值的差值最小.n<=1e5,m<=300; 思路: 可以知道每个i,如果一个区间包含这个 ...

  2. 洛谷P2577 [ZJOI2005]午餐 打饭时间作为容量DP

    P2577 [ZJOI2005]午餐 )逼着自己做DP 题意: 有n个人打饭,每个人都有打饭时间和吃饭时间.有两个打饭窗口,问如何安排可以使得总用时最少. 思路: 1)可以发现吃饭时间最长的要先打饭. ...

  3. 题目1362:左旋转字符串(Move!Move!!Move!!!)

    题目1362:左旋转字符串(Move!Move!!Move!!!) 时间限制:2 秒 内存限制:32 兆 特殊判题:否 提交:2306 解决:961 题目描述: 汇编语言中有一种移位指令叫做循环左移( ...

  4. codeforces 509 D. Restoring Numbers(数学+构造)

    题目链接:http://codeforces.com/problemset/problem/509/D 题意:题目给出公式w[i][j]= (a[i] + b[j])% k; 给出w,要求是否存在这样 ...

  5. CodeForces 917A The Monster 贪心+思维

    As Will is stuck in the Upside Down, he can still communicate with his mom, Joyce, through the Chris ...

  6. 淘淘购物系统 (Python)

    #首页def tao_first(): t1 = '欢迎进入淘淘购物'.center(110) print(t1) print('~' * 130) t2 = '注册'.center(20) prin ...

  7. Prometheus安装

    Prometheus安装 下载地址: https://prometheus.io/download/ 现在时间是: 2019.09.07 安装环境: Linux centos7 minimal 虚拟机 ...

  8. Jmeter 之 逻辑控制器 if 控制器

    最近工作不忙,利用空闲时间整理了下Jmeter的相关知识,下面给大家分享下Jmeter中 如果(if)控制的使用和应用. 如下图:线程组 > 添加 > 逻辑控制器 > 如果 (if) ...

  9. HBase工作中的一些优化方法

    1.表的设计 Pre-creating Regions(预分区) 默认情况下,在创建Hbase表的时候会自动创建一个region分区,当导入数据的时候,所有的Hbase客户端都向这一个region写数 ...

  10. 正则表达式(RegExp)

    前言:先来了解一下基础知识.再细说正则表达式~ 转义字符  ----   \ 转义字符会将与之相邻的字符转换含义. 例如说,希望在一个字符串中输出 “ 号,那么就可以使用在双引号前加入 \ ,这样就能 ...