Vergleichen von Objekten zwischen 2 verschachtelten Arrays in Angularjs und Anzeigen der entsprechenden übereinstimmenden Daten

Question

Ich habe zwei Arrays: erste ist empdata mit empid und Veranstaltungen von diesem Mitarbeiter besucht, dann zweite Array hält Ereignisdetails.

Ich muss empid von Array mit Benutzereingabe vergleichen und bestimmte Ereignisdetails anzeigen, die von entsprechenden Angestellten mit zusammenklappbaren jQuery besucht werden. Finden Sie den Gesamtpreis auch.

$scope.empdata=[]; 
$scope.data = []; 

//first array data 

    $scope.empdata.push({ 
    empid:'empid_1', 
    events:[{ 
    event:'First Event' 
    }, 
    { 
     event:'Second Event' 
    } 
    ]}) 

    $scope.empdata.push({ 
    empid:'empid_2', 
    events:[{ 
     event:'First Event' 
    }, 
    { 
     event:'Second Event' 
    }, 
    { 
    event:'Third Event' 
    }] 
    }) 

     //second array data 
       $scope.data.push({ 
        event:'First Event', 
        date: '10-jun-2015', 
        type:[{ 
         name: 'Hotel Booking', 
         price: 400.00 
         },{ 
         name: 'Flight', 
         price: 400.00  
         },{ 
         name: 'Honorarium', 
         price: 900.00  
        }] 
       }) 


       $scope.data.push({ 
        event:'Second Event', 
        date: '27-july-2015', 
        type:[{ 
         name: 'Hotel Booking', 
         price: 530.00 
         },{ 
         name: 'Train', 
         price: 400.00  
         },{ 
         name: 'Honorarium', 
         price: 600.00 
        }] 
       }) 

       $scope.data.push({ 
        event:'Third Event', 
        date: '20-aug-2015', 

        type:[{ 
         name: 'Hotel Booking', 
         price: 910.00 
         },{ 
         name: 'Flight', 
         price: 500.00  
         },{ 
         name: 'Honorarium', 
         price: 1500.00 
        }] 
       }) 

Vielen Dank im Voraus!

Answer 1

Sie können dazu custom filter verwenden.

Custom Filter Docs

siehe unten exmaple

var app = angular.module('app', []); 
 

 
app.filter('findobj', function() { 
 
    return function(dataobj, selected) { 
 
    return dataobj.filter(function(data) { 
 
     return (selected || []).some(function(s) { 
 
     return data.event === s.event; 
 
     }); 
 
    }); 
 
    }; 
 
}); 
 
app.controller('ctrl', function($scope) { 
 

 
    $scope.empdata = []; 
 
    $scope.data = []; 
 
    $scope.empdata.push({ 
 
    empid: 'empid_1', 
 
    events: [{ 
 
     event: 'First Event' 
 
    }, { 
 
     event: 'Second Event' 
 
    }] 
 
    }) 
 

 

 

 
    $scope.empdata.push({ 
 
    empid: 'empid_2', 
 
    events: [{ 
 
     event: 'First Event' 
 
    }, { 
 
     event: 'Second Event' 
 
    }, { 
 
     event: 'Third Event' 
 
    }] 
 
    }) 
 

 
    $scope.empdata.push({ 
 
    empid: 'empid_3', 
 
    events: [{ 
 
     event: 'Forth Event' 
 
    }, { 
 
     event: 'Fifth Event' 
 
    }] 
 
    }) 
 

 
    //second array data 
 
    $scope.data.push({ 
 
    event: 'First Event', 
 
    date: '10-jun-2015', 
 
    type: [{ 
 
     name: 'Hotel Booking', 
 
     price: 400.00 
 
    }, { 
 
     name: 'Flight', 
 
     price: 400.00 
 
    }, { 
 
     name: 'Honorarium', 
 
     price: 900.00 
 
    }] 
 
    }) 
 

 

 
    $scope.data.push({ 
 
    event: 'Second Event', 
 
    date: '27-july-2015', 
 
    type: [{ 
 
     name: 'Hotel Booking', 
 
     price: 530.00 
 
    }, { 
 
     name: 'Train', 
 
     price: 400.00 
 
    }, { 
 
     name: 'Honorarium', 
 
     price: 600.00 
 
    }] 
 
    }) 
 

 
    $scope.data.push({ 
 
    event: 'Forth Event', 
 
    date: '27-july-2015', 
 
    type: [{ 
 
     name: 'Hotel Booking', 
 
     price: 530.00 
 
    }, { 
 
     name: 'Train', 
 
     price: 400.00 
 
    }, { 
 
     name: 'Honorarium', 
 
     price: 600.00 
 
    }] 
 
    }) 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="app"> 
 
    <div ng-controller="ctrl"> 
 
    <select ng-options="emp.events as emp.empid for emp in empdata" ng-model="selected"></select> 
 
    <hr/>Selected: {{selected}} 
 
    <hr/> 
 
    <div ng-repeat="d in data | findobj:selected ">{{d}}</div> 
 
    </div> 
 
</div>