import { AdminService } from 'src/app/services/admin.service';
import { HttpClient } from '@angular/common/http';
import { Component, OnInit } from '@angular/core';
import { Player } from './player.model';
import { LoggerService } from 'src/app/services/logger.service';
import {Sort} from '@angular/material';
import { last, map } from 'rxjs/operators';
@Component({
selector: 'app-players',
templateUrl: './players.page.html',
styleUrls: ['./players.page.scss'],
})
export class PlayersPage implements OnInit {
data = [{ "_id" : { "id" : ObjectId("5cc99406babc4817f85c707e"), "email" : "juliatyles@gmail.com" }, "buyer" : [ "juliatyles@gmail.com" ], "event" : "COED A", "field" : "Main", "net" : null, "team" : null, "player" : { "overallRanking" : { "CoedRanking" : 17, "CoedRankingG" : 17, "Ranking" : 25, "RankingG" : 40 }, "shirtSize" : "S", "ranking" : { "PoolCAAG" : 31, "PoolCBB" : 17, "PoolCOpenG" : 9, "PoolWA" : 22, "PoolWAA" : 3, "PoolWOpenG" : 40 }, "avp_id" : "1013424", "adult" : true, "country" : "united states", "zip" : "10924", "state" : "ny", "city" : "goshen", "address" : "4 Maple Ave", "phone" : "8452589229", "email" : "juliatyles@gmail.com", "last" : "Tyles", "first" : "Julia", "completed" : true, "waivers" : ObjectId("5cc98496babc4817f85c6f65") }, "waivers" : [ { "url" : [ "https://waiverstevie.koptional.com/form/v7/juliatyles@gmail.com/9CYPpy1Cwa14SzS5uCb7ULX4q1HtEjvWnHYlOT3K" ], "message" : [ "Liability Waiver" ], "has_signed" : [ true ], "signatureUrl" : [ "https://s3.amazonaws.com/formsign.storage/public/signed/oqPxjdKjAUlWIqNbqtMz37Iu1FdbasvQhmvomen2.pdf" ], "email" : [ "juliatyles@gmail.com" ] } ] }
{ "_id" : { "id" : ObjectId("5cc99406babc4817f85c707e"), "email" : "lewiseric343@yahoo.com" }, "buyer" : [ "juliatyles@gmail.com" ], "event" : "COED A", "field" : "Main", "net" : null, "team" : null, "player" : { "overallRanking" : { "CoedRanking" : 32, "CoedRankingG" : 32, "Ranking" : 4 }, "shirtSize" : "XL", "ranking" : { "PoolCA" : 14, "PoolCAAG" : 7, "PoolCBB" : 17, "PoolMAA" : 3 }, "avp_id" : "1018083", "adult" : true, "country" : "united stated ", "zip" : "10924", "state" : "ny", "city" : "goshen", "address" : "4 Maple Ave", "phone" : "8452757319", "email" : "lewiseric343@yahoo.com", "last" : "lewis", "first" : "eric", "completed" : true, "waivers" : ObjectId("5cc99407babc4817f85c707f") }, "waivers" : [ { "url" : [ "https://waiverstevie.koptional.com/form/v7/lewiseric343@yahoo.com/vT15NATFszkaoy2h4KQbcW0KBMYyMLQlB6GONPIa" ], "message" : [ "Liability Waiver" ], "has_signed" : [ false ], "signatureUrl" : [ ], "email" : [ "lewiseric343@yahoo.com" ] } ] }
{ "_id" : { "id" : ObjectId("5cc994c6babc4817f85c7096"), "email" : "axacast22@aol.com" }, "buyer" : [ "axa_to@yahoo.com" ], "event" : "COED A", "field" : "Main", "net" : null, "team" : null, "player" : { "shirtSize" : "L", "avp_id" : "1035488", "adult" : true, "country" : "United States", "zip" : "07410", "state" : "NJ", "city" : "Fair Lawn", "address" : "45 26Th Street", "phone" : "2016757924", "email" : "axacast22@aol.com", "last" : "Duran", "first" : "Jesus", "completed" : true, "waivers" : ObjectId("5cc994c6babc4817f85c7097") }, "waivers" : [ { "url" : [ "https://waiverstevie.koptional.com/form/v7/axacast22@aol.com/LFSV6Cf02Gf2aqGZkbLr9lNWzWOuUWKzt42i5Xom" ], "message" : [ "Liability Waiver" ], "has_signed" : [ false ], "signatureUrl" : [ ], "email" : [ "axacast22@aol.com" ] }, { "url" : [ "https://waiverstevie.koptional.com/form/v7/axacast22@aol.com/LFSV6Cf02Gf2aqGZkbLr9lNWzWOuUWKzt42i5Xom" ], "message" : [ "Liability Waiver" ], "has_signed" : [ false ], "signatureUrl" : [ ], "email" : [ "axacast22@aol.com" ] } ] }
{ "_id" : { "id" : ObjectId("5cc99781babc4817f85c70b8"), "email" : "kevin.c.cole@gmail.com" }, "buyer" : [ "kevinccole@gmail.com" ], "event" : "COED A", "field" : "Main", "net" : null, "team" : null, "player" : { "completed" : true, "first" : "Kevin", "last" : "Cole", "email" : "kevin.c.cole@gmail.com", "phone" : "6034758538", "address" : "1035 S Mammoth Rd, Unit 7", "city" : "Manchester", "state" : "NH", "zip" : "03109", "country" : "United States", "adult" : true, "avp_id" : "1016822", "ranking" : { "PoolMAAG" : 3, "PoolCAG" : 17, "PoolCAAG" : 122 }, "shirtSize" : "M", "overallRanking" : { "RankingG" : 3 }, "waivers" : ObjectId("5cc99781babc4817f85c70ba") }, "waivers" : [ { "url" : [ "https://waiverstevie.koptional.com/form/v7/kevin.c.cole@gmail.com/3xrsKWtVlnyjHN2xLhL1XDg3gxUDfuu0D35irIwZ" ], "message" : [ "Liability Waiver" ], "has_signed" : [ true ], "signatureUrl" : [ "https://s3.amazonaws.com/formsign.storage/public/signed/alpoVABWf4jIFERmaXj8fwhlJ1sToMRF3URjz6mB.pdf" ], "email" : [ "kevin.c.cole@gmail.com" ] }, { "url" : [ "https://waiverstevie.koptional.com/form/v7/kevin.c.cole@gmail.com/3xrsKWtVlnyjHN2xLhL1XDg3gxUDfuu0D35irIwZ" ], "message" : [ "Liability Waiver" ], "has_signed" : [ true ], "signatureUrl" : [ "https://s3.amazonaws.com/formsign.storage/public/signed/alpoVABWf4jIFERmaXj8fwhlJ1sToMRF3URjz6mB.pdf" ], "email" : [ "kevin.c.cole@gmail.com" ] } ] }
{ "_id" : { "id" : ObjectId("5cc99b48babc4817f85c70fd"), "email" : "coachcurci@gmail.com" }, "buyer" : [ "coachcurci@gmail.com" ], "event" : "COED A", "field" : "Main", "net" : null, "team" : null, "player" : { "shirtSize" : null, "avp_id" : 1010562, "adult" : true, "zip" : "19054", "state" : "pa", "city" : "levittown", "address" : "9071 millcreek rd ", "phone" : "2152084791", "email" : "coachcurci@gmail.com", "last" : "Curci", "first" : "Jacquelyn", "_id" : ObjectId("5ccaf0263a2bba2ca0f83748"), "waivers" : ObjectId("5cc99b48babc4817f85c70fe"), "completed" : true, "country" : "US", "signed" : false, "shirt_size" : "N/A" }, "waivers" : [ { "url" : [ "https://waiverstevie.koptional.com/form/v7/coachcurci@gmail.com/eCSHwcikcmGP4DaxebeX8toP85MzlSptzvrsSCzt" ], "message" : [ "Liability Waiver" ], "has_signed" : [ true ], "signatureUrl" : [ "https://s3.amazonaws.com/formsign.storage/public/signed/lnaeaOZA2g665YYRDbg4f8zV2ZX2fEz70pI3Gx2I.pdf" ], "email" : [ "coachcurci@gmail.com" ] } ] }
{ "_id" : { "id" : ObjectId("5cc99b48babc4817f85c70fd"), "email" : "jkoodathil@gmail.com" }, "buyer" : [ "coachcurci@gmail.com" ], "event" : "COED A", "field" : "Main", "net" : null, "team" : null, "player" : { "shirtSize" : null, "overallRanking" : { "Ranking" : 5 }, "avp_id" : 1079367, "adult" : true, "zip" : "19020", "state" : "pa", "city" : "bensalem ", "address" : "2139 joshua rd ", "phone" : "+1 (267) 581-7523", "email" : "jkoodathil@gmail.com", "last" : "Koodathil", "first" : "James", "_id" : ObjectId("5ccaf0263a2bba2ca0f83747"), "waivers" : ObjectId("5cc99b48babc4817f85c7100"), "completed" : true, "country" : "US", "signed" : false, "shirt_size" : "N/A" }, "waivers" : [ { "url" : [ "https://waiverstevie.koptional.com/form/v7/jkoodathil@gmail.com/jhOxsMP9ebTkhzTEaxCeiWk6HJPEtFQCrZ7nLiNz" ], "message" : [ "Liability Waiver" ], "has_signed" : [ true ], "signatureUrl" : [ "https://s3.amazonaws.com/formsign.storage/public/signed/tcbxdipuqSvculgiKkNpis6fJGx4cDkhGtSbh22T.pdf" ], "email" : [ "jkoodathil@gmail.com" ] } ] }
{ "_id" : { "id" : ObjectId("5cc99b5ebabc4817f85c7105"), "email" : "beccas.edventure@gmail.com" }, "buyer" : [ "jmlaughman@gmail.com" ], "event" : "COED A", "field" : "Main", "net" : null, "team" : null, "player" : { "overallRanking" : { "Ranking" : 5 }, "shirtSize" : "XS", "avp_id" : "1079953", "adult" : true, "country" : "United States", "zip" : "17257", "state" : "PA", "city" : "Shippensburg", "address" : "23 Feather Dr", "phone" : "3019919314", "email" : "beccas.edventure@gmail.com", "last" : "Morgan", "first" : "Rebecca", "completed" : true, "waivers" : ObjectId("5cc99b5ebabc4817f85c7107") }, "waivers" : [ { "url" : [ "https://waiverstevie.koptional.com/form/v7/beccas.edventure@gmail.com/jI9L3TG7BHIFyzBoL7dV1ZhSaBxSzKFQYboM4uDj" ], "message" : [ "Liability Waiver" ], "has_signed" : [ true ], "signatureUrl" : [ "https://s3.amazonaws.com/formsign.storage/public/signed/Jbe9sBWVLukgiKkUGdCWoOF4NiUjyb9TPlU0GhW2.pdf" ], "email" : [ "beccas.edventure@gmail.com" ] } ] }
{ "_id" : { "id" : ObjectId("5cc99b5ebabc4817f85c7105"), "email" : "jmlaughman@gmail.com" }, "buyer" : [ "jmlaughman@gmail.com" ], "event" : "COED A", "field" : "Main", "net" : null, "team" : null, "player" : { "overallRanking" : { "Ranking" : 5 }, "shirtSize" : "M", "avp_id" : "1080148", "adult" : true, "country" : "US", "zip" : "17257", "state" : "PA", "city" : "Shippensburg", "address" : "23 Feather Dr", "phone" : "7177299191", "email" : "jmlaughman@gmail.com", "last" : "Laughman", "first" : "Jonathan", "completed" : true, "waivers" : ObjectId("5cc99b5ebabc4817f85c7106") }, "waivers" : [ { "url" : [ "https://waiverstevie.koptional.com/form/v7/Jmlaughman@gmail.com/5pGu62Cuio0pV8Pf7ZieaV2Hc0Y1c82XtoKsGdCo" ], "message" : [ "Liability Waiver" ], "has_signed" : [ true ], "signatureUrl" : [ "https://s3.amazonaws.com/formsign.storage/public/signed/nJnjHtOCrEDOqSAShDvoFrQQ2kCgRLAEGEX71yI5.pdf" ], "email" : [ "Jmlaughman@gmail.com" ] } ] }];
displayedColumns = ["event", "field", "player", "signed", "waiver", "sendwaiver"];
signed;
unsigned;
dummies;
size: number;
constructor() {
}
ngOnInit() {
//this.pages = this.adminService.getJuliePages();
//console.log(this.pages);
//this.adminService.GetUnsignedWaivers()
//.subscribe((data: any) => {
// FILTER THE DATA TO GET COUNTS OF EACH
// I want to filter the data to show all missing partners
this.dummies = this.data.filter((x: any) => {
return x.player.email === "dummypartner@pottstown.com";
});
// filter the data to show who has not signed the waiver
this.unsigned = this.data.filter((x: any) => {
return x.waivers.has_signed === false;
});
// filter the data to show who has signed the waiver
this.signed = this.data.filter((x: any) => {
return x.waivers.has_signed === true;
});
console.log(this.dummies);
console.log(this.unsigned);
console.log(this.signed);
this.players = this.data;
this.players.forEach((p) => {
p.waivers =
p.waivers.map( w => {
if (w.signatureUrl.length > 0) {
w.url = w.signatureUrl;
w.message = "View Waiver";
}
return w;
});
});
console.log("dummies" + this.dummies + "signed", this.signed, "unsigned", this.unsigned);
this.size = this.players.length;
console.log(this.players);
});
}
}
.tab-selected {
color: #fff; /*your text color */
background: navy; /* your background color*/
}
.mat-table {
border: 0px solid black;
.mat-cell {
display: flex;
flex-direction: column;
justify-content: center;
text-align: left;
.mat-cell {
min-height: 60px;
border-bottom: 0px solid grey;
&:last-child {
border-bottom: none;
}
}
}
}
<ion-header>
<ion-toolbar color="primary">
<ion-buttons slot="start">
<ion-back-button defaultHref="/app/admin"></ion-back-button>
</ion-buttons>
<ion-title>Players ({{players?.length}})</ion-title>
<ion-subtitle>Signed: {{signed?.length}} Unsigned: {{unsigned?.length}} Dummies: {{dummies?.length}}</ion-subtitle>
</ion-toolbar>
</ion-header>
<ion-content padding>
<mat-table class="players-table mat-elevation-z8" [dataSource]="players">
<ng-container matColumnDef="event">
<mat-header-cell *matHeaderCellDef>Event</mat-header-cell>
<mat-cell *matCellDef="let player">{{player.event}}</mat-cell>
</ng-container>
<ng-container matColumnDef="field">
<mat-header-cell *matHeaderCellDef>Field</mat-header-cell>
<mat-cell class="field-cell"
*matCellDef="let player">{{player.field}}</mat-cell>
</ng-container>
<ng-container matColumnDef="player">
<mat-header-cell *matHeaderCellDef>Player</mat-header-cell>
<mat-cell class="player-cell" *matCellDef="let player"><a href="mailto:{{player.player.email}}">{{player.player.first}} {{player.player.last}}</a>
</mat-cell>
</ng-container>
<ng-container matColumnDef="signed">
<mat-header-cell *matHeaderCellDef> Signed? </mat-header-cell>
<mat-cell *matCellDef="let player">
<ng-container *ngFor="let waiver of player.waivers">
{{waiver.has_signed}}
</ng-container>
</mat-cell>
</ng-container>
<ng-container matColumnDef="waiver">
<mat-header-cell *matHeaderCellDef> Waiver </mat-header-cell>
<mat-cell *matCellDef="let player">
<ng-container *ngFor="let waiver of player.waivers">
<a href="{{waiver.url}}">{{waiver.message}}</a>
</ng-container>
</mat-cell>
</ng-container>
<ng-container matColumnDef="sendwaiver">
<mat-header-cell *matHeaderCellDef>Send Waivers</mat-header-cell>
<mat-cell class="sendwaiver-cell" *matCellDef="let player">
<ion-button (click)="adminWaiverSend(player)" *ngIf="!player.waivers.has_signed"> Send Waivers
</ion-button>
</mat-cell>
</ng-container>
<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
<mat-row *matRowDef="let row; columns: displayedColumns" (click)="onRowClicked(row)"></mat-row>
</mat-table>
</ion-content>
我的对象数组中具有以下数据结构:
[{
event: string,
day: string,
player: {
first: string,
last: string,
email: string
},
waivers: [{
url: string,
signatureUrl: string,
email: string,
message: string
}],
_id: {
id: objectID,
email: string
},
...]
在我的组件中,我想过滤数据,以便显示三个不同的东西:
this.dummies
将过滤结果以显示player.email
为dummypartner@pottstown.com
的所有记录unsigned
将通过豁免数组的has_signed
属性过滤结果。应该将其设置为false
signed
应该通过嵌套数组豁免的has_signed
属性等于true
this.adminService.GetUnsignedWaivers()
.subscribe((data: []) => {
this.dummies = data.filter(x => {
return x.player.email === "dummypartner@pottstown.com";
});
this.unsigned = data.filter(x => {
x.waivers.filter(w => {
return w.has_signed === false;
});
});
this.signed = data.filter(x => {
x.waivers.filter(w => {
return w.has_signed === true;
});
});
this.players = data;
this.players.forEach((p) => {
p.waivers = p.waivers.map( w => {
if (w.signatureUrl.length > 0) {
w.url = w.signatureUrl;
w.message = "View Waiver";
}
return w;
});
});
我试图使以上内容显示为代码,但无法正常工作! :(
我的初始查询的结果显示得很好,但是过滤后的数据的计数并没有在控制台中显示和记录为未定义。
我该怎么做?
看着这个,我可以理解为什么它可能不起作用,但是我不知道如何在我的聚合中对豁免进行分组,因此值不在数组中(因为它们不是数组,而是字符串)。
我的后端聚合查询:
Registration.aggregate([
{$unwind: "$players"},
{$unwind:"$players.waivers"},
{$lookup:{
from:"waiverrecipients",
localField: "players.waivers",
foreignField:"_id",
as:"waivers"
}},
{$group:
{
"_id":{"id": "$_id","email": "$players.email"},
"buyer": {"$first": "$users"},
"event": {"$first": "$event"},
"field": {"$first": "$field"},
"net": {"$first": "$net"},
"team": {"$first": "$team"},
"player": { "$first": "$players" },
"waivers": {"$push":{
"url": "$waivers.url",
"message": "$waivers.message",
"has_signed": "$waivers.has_signed",
"signatureUrl": "$waivers.signatureUrl",
"email": "$waivers.email"
} }}},
{$sort:
{
"event": 1,
"_id.id": 1,
"_id.email": 1,
}}
])
答案 0 :(得分:1)
如果只需要过滤后的数组和计数,则可以使用data
对forEach
数组进行一次迭代,并检查每个条件,如果满足条件,则推入适当的数组。这样便得到了三个过滤后的数组,并且可以对其中的任何一个调用.length
方法来获取计数。
// app.component.ts
let players: any[] = [];
let dummies: any[] = [];
let unsigned: any[] = [];
let signed: any[] = [];
this.adminService.GetUnsignedWaivers().subscribe((data: any[]) => {
data.forEach(x => {
if (x.player.email === 'dummypartner@pottstown.com') {
dummies.push(x);
}
x.waivers.forEach(waiver => {
if (waiver.has_signed[0] === true) {
signed.push(waiver);
} else {
unsigned.push(waiver);
}
if (waiver.signatureUrl.length > 0) {
waiver.url = waiver.signatureUrl;
waiver.message = "View Waiver";
}
}); // waiver forEach
}); // data forEach
this.players = data;
}); // subscribe
如果您想使用filter
方法:
// app.component.ts
let players: any[];
let dummies: any[];
let unsigned: any[] = [];
let signed: any[] = [];
this.adminService.GetUnsignedWaivers().subscribe((data: any[]) => {
let updatedData = data.map(x => {
x.waivers.forEach(waiver) {
if (waiver.signatureUrl.length > 0) {
waiver.url = waiver.signatureUrl;
waiver.message = "View Waiver";
}
});
return x;
}); // map
this.dummies = updatedData.filter(x => {
x.player.email === 'dummypartner@pottstown.com';
}); // filter
updatedData.forEach(x => {
unsigned = unsigned.concat(x.waivers.filter(w => !w.has_signed[0]));
signed = signed.concat(x.waivers.filter(w => w.has_signed[0]));
}); // forEach
this.players = updatedData;
}); // subscribe
请注意,由于您使用的是材料表,因此可以添加带有少量代码的过滤器:
<!-- app.component.html -->
<mat-form-field>
<input matInput (keyup)="applyFilter($event.target.value)" placeholder="Filter">
</mat-form-field>
// app.component.ts
applyFilter(filterValue: string) {
this.dataSource.filter = filterValue.trim().toLowerCase();
}
答案 1 :(得分:1)
[{
event: string,
day: string,
player: {
first: string,
last: string,
email: string
},
waivers: [{
url: string,
signatureUrl: string,
email: string,
message: string
}],
_id: {
id: objectID,
email: string
},
...]
this.dummies = data
.filter(item => item.player.email === 'dummypartner@pottstown.com');
this.unsigned = data
.filter(item => item.waivers.some(waiver => !waiver.has_signed));
this.signed = data
.filter(item => item.waivers.some(waiver => !!waiver.has_signed));
这足以满足您的需求。我不明白为什么您编写了这么多复杂的代码!
答案 2 :(得分:1)
在您的组件代码中,要过滤的内容与数据结构本身不匹配。例如:
this.dummies = this.data.filter((x: any) => {
// `x` does not have a `player` property based on `this.data` structure
// The same holds true for all other filter predicates in the file
return x.player.email === "dummypartner@pottstown.com";
});
第二次尝试的问题在于如何过滤数据...
this.unsigned = data.filter(x => {
x.waivers.filter(w => {
return w.has_signed === false;
});
外部过滤器函数不返回,因此返回值为undefined
,根据JS标准为false-y。您的unsigned
数组始终为空,因为无论如何过滤谓词都会返回false-y语句。
此外,您的数据结构不包含has_signed
的定义。您确定它总是存在吗?如果数据对象中不存在has_signed
,则w.has_signed
为undefined
,并且w.has_signed === false
返回false
。您可以选择不使用类型安全比较(==
而不是===
),或者通过返回!w.has_signed
使用JS隐式类型转换功能。
因此,我将像这样重新进行过滤(将相同的逻辑应用于signed
过滤):
// If you want all objects from `data` where at least one object from `wavers` has not signed
this.unsigned = data.filter(x => x.waivers.some(w => !w.has_signed));
// ^^ With no curly braces the result of the single statement is also the return value
// If you want all the objects from `waivers` with false-y `has_signed`
this.unsigned = data.reduce((x, acc) => [...acc, ...x.waivers.filter(w => !w.has_signed)], []);
对于最后一部分,不建议对已经存储在其他位置的数据进行突变。我建议对对象进行浅表复制,如下所示:
this.players = data.map(p => ({
...p,
waivers: p.waivers.map(w =>
w.signatureUrl.length > 0
? { ...w, url: w.signatureUrl, message: "View Waiver" }
: w
)
}));
希望这会有所帮助! :-)
答案 3 :(得分:1)
我用Express和Mongo创造了这种情况。我已插入数据并进行了简单查询。像这样:
function getPlayers(req, res) {
ObjectModel.find( (err, data) => {
if ( err ) {
return res.status(500).send({
message: err
});
}
return res.status(200).send({
data
});
})
}
您必须修改服务以返回数组:
GetUnsignedWaivers() {
return this.http.get<any>(this.url + '/getPlayers').pipe(
flatMap( data => data.data ),
toArray()
);
}
因此,您保证您拥有一系列物品。 然后,您可以订阅:
this.adminService.GetUnsignedWaivers().subscribe( (data) => {
this.dummies = data.filter(item => {
if (item.player) {
return item.player.email === 'dummypartner@pottstown.com';
} else {
return false;
}
});
data.forEach( (item, idx) => {
let flag = false;
if (item.waivers) {
item.waivers.forEach(x => {
if (!x.has_signed[0]) {
flag = true;
}
});
if (flag) {
this.unsigned.push(item);
} else {
this.signed.push(item);
}
}
});
console.log(this.dummies);
console.log(this.unsigned);
console.log(this.signed);
});
希望对您有帮助