I'm having two arrays : first one is empdata
holding empid
and events attended by that employee, then second array is holding event details.
I need to compare empid
from array with user input and display particular event details attended by respective employee using collapsible jQuery. Find total price also.
$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
}]
})
Thanks in advance!
You can use custom filter
for this.
see the below 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>