第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問(wèn)題,去搜搜看,總會(huì)有你想問(wèn)的

元素中的角度ng-repeat條件包裝項(xiàng)目(ng-repeat中的組項(xiàng)目)

元素中的角度ng-repeat條件包裝項(xiàng)目(ng-repeat中的組項(xiàng)目)

繁華開滿天機(jī) 2019-10-18 14:32:18
我正在嘗試使用條件將項(xiàng)目分組為ng-repeat。一個(gè)示例條件是將所有元素分組為同一小時(shí)。數(shù)據(jù):[    {name: 'AAA', time: '12:05'},    {name: 'BBB', time: '12:10'},    {name: 'CCC', time: '13:20'},    {name: 'DDD', time: '13:30'},    {name: 'EEE', time: '13:40'},    ...]“時(shí)間”字段實(shí)際上是一個(gè)時(shí)間戳記(1399372207),但是使用準(zhǔn)確的時(shí)間,示例輸出將更易于理解。我正在使用ng-repeat列出這些項(xiàng)目:<div ng-repeat="r in data| orderBy:sort:direction">   <p>{{r.name}}</p></div>還嘗試了:<div ng-repeat-start="r in data| orderBy:sort:direction"></div>    <p>{{r.name}}</p><div ng-repeat-end></div>有效輸出為:<div class="group-class">    <div><p>AAA</p></div>    <div><p>BBB</p></div></div><div class="group-class">    <div><p>CCC</p></div>    <div><p>DDD</p></div>    <div><p>EEE</p></div></div>如果沒(méi)有針對(duì)我的問(wèn)題的簡(jiǎn)單解決方案,我的最后一個(gè)選擇是將數(shù)據(jù)分組,然后將其分配給ng-repeat中使用的作用域變量。有什么想法嗎?
查看完整描述

3 回答

?
一只斗牛犬

TA貢獻(xiàn)1784條經(jīng)驗(yàn) 獲得超2個(gè)贊

首先在控制器中建立組:


 $scope.getGroups = function () {

    var groupArray = [];

    angular.forEach($scope.data, function (item, idx) {

        if (groupArray.indexOf(parseInt(item.time)) == -1) {

            groupArray.push(parseInt(item.time));

        }

    });

    return groupArray.sort();

};

然后為其過(guò)濾:


 myApp.filter('groupby', function(){

    return function(items,group){       

       return items.filter(function(element, index, array) {

        return parseInt(element.time)==group;

       });        

    }        

 }) ; 

然后更改模板:


 <div ng-repeat='group in getGroups()'>

     <div ng-repeat="r in data | groupby:group" class="group-class">

         <div><p>{{r.name}}</p></div>

     </div>

 </div>

查看演示


查看完整回答
反對(duì) 回復(fù) 2019-10-18
  • 3 回答
  • 0 關(guān)注
  • 665 瀏覽

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)