尝试将 属性 添加到 object inside observable
Trying to add a property to an object inside observable
根据标题,情况非常简单,尝试将参加类型 属性 添加到活动 object,如果此人正在参加(这样我就可以在视图中更改状态)。
其他注意事项,我正在使用 Angularfire 2,数据 returned 是一个可观察的 Event[] 数组。当我将 return 更改为 return (console.log({ ...event, attendingType: currentUser.type } as eventWithAttendance));
时,它会打印额外的 属性 fine.
这是界面
export interface Event {
schoolId: string;
eventId: string;
name: string;
date: Date;
timeStart: number;
timeEnd: number;
volunteersRequired: boolean;
attendance?: Array<EventUser>;
imageUrl: string;
contactName: string;
contactPhone: number;
contactEmail: string;
description: string;
}
export interface EventUser {
id: string;
email: string;
name: string;
type: ATTENDANCE;
}
export enum ATTENDANCE {
attending = 'attending',
notAttending = 'notAttending',
volunteering = 'volunteering'
}
这里是 ts 文件的代码
interface eventWithAttendance extends Event {
attendingType: ATTENDANCE;
}
ionViewDidLoad() {
this.activeSchool = this.data.activeSchool;
//this.events = this.data.getEvents(this.activeSchool.schoolId).pipe();
this.auth.user.subscribe((user) => {
this.user = user;
});
this.events = this.data.getEvents(this.activeSchool.schoolId)
.pipe(
map((events) => {
events.map( (event) => {
let currentUser = event.attendance.find(user => user.id === this.user.uid);
if(currentUser) {
return ({ ...event, attendingType: currentUser.type } as eventWithAttendance);
} else {
return event;
}
});
return events as eventWithAttendance[];
})
);
// Not a long term solution
this.currentDate = new Date().getTime(); // so we don't display old events
}
问题是数组上的 .map 不会更改原始数组,但它return是一个新数组。
因此,如果您更改:
events.map( (event) => {
收件人:
const updatedEvents = events.map( (event) => {
然后将return语句改为:
return updatedEvents as eventWithAttendance[];
根据标题,情况非常简单,尝试将参加类型 属性 添加到活动 object,如果此人正在参加(这样我就可以在视图中更改状态)。
其他注意事项,我正在使用 Angularfire 2,数据 returned 是一个可观察的 Event[] 数组。当我将 return 更改为 return (console.log({ ...event, attendingType: currentUser.type } as eventWithAttendance));
时,它会打印额外的 属性 fine.
这是界面
export interface Event {
schoolId: string;
eventId: string;
name: string;
date: Date;
timeStart: number;
timeEnd: number;
volunteersRequired: boolean;
attendance?: Array<EventUser>;
imageUrl: string;
contactName: string;
contactPhone: number;
contactEmail: string;
description: string;
}
export interface EventUser {
id: string;
email: string;
name: string;
type: ATTENDANCE;
}
export enum ATTENDANCE {
attending = 'attending',
notAttending = 'notAttending',
volunteering = 'volunteering'
}
这里是 ts 文件的代码
interface eventWithAttendance extends Event {
attendingType: ATTENDANCE;
}
ionViewDidLoad() {
this.activeSchool = this.data.activeSchool;
//this.events = this.data.getEvents(this.activeSchool.schoolId).pipe();
this.auth.user.subscribe((user) => {
this.user = user;
});
this.events = this.data.getEvents(this.activeSchool.schoolId)
.pipe(
map((events) => {
events.map( (event) => {
let currentUser = event.attendance.find(user => user.id === this.user.uid);
if(currentUser) {
return ({ ...event, attendingType: currentUser.type } as eventWithAttendance);
} else {
return event;
}
});
return events as eventWithAttendance[];
})
);
// Not a long term solution
this.currentDate = new Date().getTime(); // so we don't display old events
}
问题是数组上的 .map 不会更改原始数组,但它return是一个新数组。
因此,如果您更改:
events.map( (event) => {
收件人:
const updatedEvents = events.map( (event) => {
然后将return语句改为:
return updatedEvents as eventWithAttendance[];