Angular2 關於*ngFor 嵌套循環

阿新 • • 發佈：2017-05-22

png navbar get flow add nac content span object

在項目開發中拿到的數據是這樣的，要循環遍歷出來。可是在ng2中好像不能直接遍歷Object

  datas: any = [
    { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24"},
    { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24"},
    { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24"},
    { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24"},
    { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24"},
    { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24"},
    { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24"},
  ];

在搜索之後發現了這種方法可以實現。

array-ngfor.ts

import { Component } from [email protected]/core‘;

@Component({
  selector: ‘page-array-ngfor‘,
  templateUrl: ‘array-ngfor.html‘,
})
export class ArrayNgfor {

  constructor() { }

  datas: Array<any> = [
    { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24" },
    { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24" },
    { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24" },
    { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24" },
    { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24" },
    { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24" },
    { num: 1, date: "2017-04-12", sellNum: "1231234", sellMpney: "1233", returnNum: "24" },
  ];

  getKeys(item) {
    return Object.keys(item);
  }
}

array-ngfor.html

<ion-header>
  <ion-navbar>
    <ion-title>關於ngfor 嵌套循環</ion-title>
  </ion-navbar>
</ion-header>

<ion-content>
  <ion-row *ngFor="let item of datas">
    <ion-col *ngFor="let key of getKeys(item)"> {{ item[key] }}</ion-col> 

  </ion-row>
</ion-content>

重點的是這個方法

  getKeys(item){
        return Object.keys(item);
    }

結果：

技術分享

參考於：

https://segmentfault.com/q/1010000005727687

http://stackoverflow.com/questions/40451269/typescript-sort-generic-array

Angular2 關於*ngFor 嵌套循環

png navbar get flow add nac content span object 在項目開發中拿到的數據是這樣的，要循環遍歷出來。可是在ng2中好像不能直接遍歷Object datas: any = [ { num: 1, date: "2017

逗號運算符、do while循環、嵌套循環、數組簡介

c1、逗號運算符擴展了for循環的靈活性，因為它可以使您在一個循環中使用多個初始化或更新表達式。實例程序：#include<stdio.h> int main() { const int A=37; const int B=23; int c,d; printf(" c d\n");

C++入門經典-例3.23-使用嵌套循環輸出乘法口訣表

hid 3.2 setw ostream 排列 ide 乘法 alt closed 1：代碼如下： // 3.23.cpp : 定義控制臺應用程序的入口點。 // #include "stdafx.h" #include <iomanip> #includ

mysql存儲過程嵌套循環並分頁處理數據

null 異常處理 != type arch else while exist bsp 業務背景：公司存證產品升級，隨著數據量的增加，存證產品線按業務分表，導致以往的存證關聯數據需要做數據同步更新。版本發布前，通過當前存儲過程解決數據升級問題。##創建存證文檔關聯情況下更

shell整理（32）===兩個嵌套循環的小例子

心得 shell 思考（1）shell打印如下圖所示的圖案。shell 代碼如下：#!/bin/bashecho "-"for i in `seq 9`do for x in `seq $i` do echo -n " "

Python基礎知識進階（五---2）----程序基本結構、簡單分支、異常處理、三大實例分析、基本循環結構、通用循環構造方法、死循環嵌套循環、布爾表達式

方法算法嵌套構造方法決策樹輸入繼續實例控制上一篇隨筆寫的內容有點多了，決定分成兩節，不然自己看的時候也頭疼。三者最大實例: 分支結構可以改變程序的控制流，算法不再是單調的一步步順序執行。　　　　假設：以找出三個數字中最大者的程序設計為例。　　　　　

Nested Loops(嵌套循環)

ted 嵌套循環 card blog 參與依賴索引 div 循環先掃描驅動表的（外表），外表的每一行驅動內表，然後匹配，所以nest loops不是主要依賴於內表有多少行，而是非常依賴於驅動表到底有多少行參與nested loops,因為驅動表（或者準確的說是驅動的c

嵌套循環的運行原理

out weight for 循環 nbsp margin mil i++ print mar 以下面為例子：for(int i=0;i<2;i++){ for(int j=0;j<2;j++){ System.out.println("

oracle PLSQL 多結果集嵌套循環處理優化

from then PE The 多結果集多結果 som HERE oracl oracle多結果集嵌套循環處理優化 --性能差 begin for a in (select id,name,sex,idcard from people) loop fo

嵌套循環

輸出裏的刪除目錄 read ID 倒計時 type amp 嵌套循環： 1 12 123 1234 12345 #!/bin/bash for ((y=1;y<=5;y++)) do for ((x=1;x<=$y;x++)) do echo -n $x

嵌套循環的優化

問題 list 拆分邏輯用戶體驗提醒需求內部有著需求背景今天拿到這樣一個需求：有Map A和Map B，這兩個Map都持有著一個同樣的key——id，其對應的value可能相同，也可能不相同。現在需要對兩個Map中該key對應的value相同的鍵值對做些特殊

高效遍歷匹配Json數據，避免嵌套循環[轉]

兩個 ret 數組 let span 中國 ++ str false 工作中經常會遇到這樣的需求：1.購物車列表中勾選某些，點擊任意一項，前往詳情頁，再返回購物車依舊需要呈現勾選狀態2.勾選人員後，前往別的頁面，再次返回，人員依舊程勾選狀態3.等等....

實例22 使用嵌套循環在控制臺上輸出九九乘法表

string [] 乘法輸出 sys pub sta light str package wjf; public class wjf3 { public static void main(String[] args){ for(int i=1;i<=

雙層for循環嵌套問題：

ace ostream class style ret pan span sin ron 當兩個for循環嵌套時，是第一個for語句先執行完還是第二個for語句先執行完呢？？？具體的順序到底是什麽樣的呢？？？雖說問題簡單，但本人感覺獲益匪淺，C++語言著實博大精深。

用itertools.product簡化嵌套for循環

rom 輸入密碼暴力破解 abc 暴力破解密碼 .html 一個字符串 ins 今天這一題叫做“偷瞄到的密碼”：警察跟蹤一名竊賊來到了一個倉庫門前。倉庫的密碼鎖盤如下： 1 2 3 4 5 6 7 8 9 0 竊賊輸入密碼後進了門。警察“覺得”自己看到了密碼比

第6章第2講循環嵌套結構

++ pri -1 style margin wid 分享 play () main() { int i,j; for(i=1;i<=4;i++) { for(j=1;j<=i;j++)

嵌套 JSON 對象中的數組使用 for-in 來循環訪問每個數組

obj blog 網站 for 內嵌 info 菜鳥 dem site <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>菜鳥教程(runoo

21：python 循環嵌套

python 數據分析 ubuntu linux 人工智能機器學習Python 語言允許在一個循環體裏面嵌入另一個循環。Python for循環嵌套語法：foriterating_varinsequence: foriterating_varinsequence: statements(s)stat

關於Qt的事件循環以及QEventLoop的簡單使用（QEventLoop::quit()能夠終止事件循環，事件循環是可以嵌套的）

blank 事件循環 sign amp 問題： sprite class nec ica http://www.cnblogs.com/-wang-cheng/p/4973021.html 1.一般我們的事件循環都是由exec()來開啟的，例如下面的例子： 1

for循環嵌套

循環嵌套技術循環嵌套 com 乘法 end png 技術分享打印結果結論：從第一個循環裏面取第一個值然後去下面的循環裏面全部循環一遍然後再取第一個循環裏面的第二個值，以此類推如九九乘法表 for i in range(1,

Angular2 關於*ngFor 嵌套循環

相關推薦