简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
javascript – Die mit Angular angeforderten Daten müssen zeitabhängig in Blöcken auf der Seite gerendert werden.
欧阳克
欧阳克 2017-06-28 09:27:04
0
2
726 
$scope.data=[ {"time":"2017/06/23","money":"3000","type":"RMB"}, {"time":"2017/06/24","money":"4000","type":"RMB"}, {"time":"2017/07/23","money":"3000","type":"RMB"}, {"time":"2017/07/24","money":"4000","type":"RMB"}, {"time":"2017/07/25","money":"5000","type":"RMB"} ];

Die angeforderten Daten ähneln diesen. Die Daten müssen basierend auf dem Zeitfeld und dem Monat angezeigt werden. Wie werden die Daten im Juni und Juli gefiltert?
June
Achten Sie auf die 23. Kategorie: 3000: RMB
24. Betrag: 4000 Kategorie: RMB
july
23rd Betrag: 3000 Kategorie: RMB
24th Betrag: 4000 Kategorie: RMB
25. Betrag: 5000 Kategorie: RMB

欧阳克
欧阳克

温故而知新，可以为师矣。 博客：www.ouyangke.com

Antworte allen (2)
習慣沉默
習慣沉默2017-06-28 09:29:04 2 Etage

最终把数据格式转换成：

newData = [ { time: '2017/06', items: [ { time: '2017/06/23', money: '3000', type: 'RMB'}, { time: '2017/06/24', money: '4000', type: 'RMB'}, ] }, { time: '2017/07', items: [ { time: '2017/07/23', money: '3000', type: 'RMB'}, { time: '2017/07/24', money: '4000', type: 'RMB'}, ] }, ];

然后使用两个ng-repeat渲染。

至于思路的话：

  1. 先转换成一个对象：

    obj = {

    '2016/06': [ { time: '2017/06/23', money: '3000', type: 'RMB'}, { time: '2017/06/24', money: '4000', type: 'RMB'}, ], '2016/07': [ { time: '2017/07/23', money: '3000', type: 'RMB'}, { time: '2017/07/24', money: '4000', type: 'RMB'}, ]

    }

  2. 然后遍历对象，转换成数组。

const data = [ { time: '2016/06/23', money: '1000', type: 'RMB' }, { time: '2016/06/24', money: '1200', type: 'RMB' }, { time: '2016/07/12', money: '1200', type: 'RMB' }, { time: '2016/07/15', money: '1200', type: 'RMB' }, ]; const obj = _.groupBy(data, item => item.time.substr(0, 7)); // 我这里使用了lodash，自行遍历数组也是一样的 const newData = Object.keys(obj).map(time => ({ time, items: obj[time] })); console.log(newData, 2);
Wie+0
Antwort hinzufügen
    淡淡烟草味
    淡淡烟草味2017-06-28 09:29:04 1 Etage

    虽然可以利用数组过滤匹配等对time进行拆分成你想要的格式，但是考虑到效率问题，我建议这些在服务端进行处理，返回你想要的数据格式，实在没办法的话再考虑数据分类处理

    Wie+0
    Antwort hinzufügen
      Beliebte Themen
      Mehr>
      Populäre Artikel
      Beliebte Tutorials
      Mehr>
      Verwandte Tutorials
      Beliebte Empfehlungen
      Aktuelle Kurse
      Neueste Downloads
      Mehr>
      Web-Effekte
      Quellcode der Website
      Website-Materialien
      Frontend-Vorlage
      Über uns Haftungsausschluss Sitemap
      Chinesische PHP-Website：Online-PHP-Schulung für das Gemeinwohl，Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln！