找不到已在组件中设置为属性的名称

时间:2018-03-24 12:02:49

标签: angular typescript

我在TypeScript v2.7.1中使用Angular 5,编译后我的client-details.component.ts抛出了这个错误:

  

src / app / components / client-details / client-details.component.ts(43,41)中的错误:错误TS2552:找不到名称'事件'。你的意思是'事件'?

上下文: ngOnInitgetClient(id)调用clientService,该Event[]应返回类型为Observable:import { Component, OnInit } from '@angular/core'; import { ClientService } from '../../services/client.service'; import { EventService } from '../../services/event.service'; import { Router, ActivatedRoute, Params } from '@angular/router'; import { FlashMessagesService } from 'angular2-flash-messages'; import { Client } from '../../models/Client'; import { Event } from '../../models/Event'; @Component({ selector: 'app-client-details', templateUrl: './client-details.component.html', styleUrls: ['./client-details.component.css'] }) export class ClientDetailsComponent implements OnInit { id: string; client: Client; event: Event; events: Event[]; hasDeposit: boolean = false; showDepostUpdateInput: boolean = false; constructor( private clientService: ClientService, private eventService: EventService, private router: Router, private route: ActivatedRoute, private flashMessage: FlashMessagesService, ) { } ngOnInit() { // Get id from url this.id = this.route.snapshot.params['id']; // Get the client this.clientService.getClient(this.id).subscribe(client => { if(client != null) { // Get all events this.eventService.getEvents(this.id).subscribe(events => { this.events = events; <-- I would assume an error would appear here too? (It does not) }); } this.client = client; this.events = events; <-- Error thrown here }); } ... (来自 FireStore的文档)订阅了。

客户details.component.ts:

import { Injectable } from '@angular/core';
import { AngularFirestore, AngularFirestoreCollection, AngularFirestoreDocument } from 'angularfire2/firestore';
import { Observable } from 'rxjs/observable';
import { Event } from '../models/Event';

@Injectable()
export class EventService {
  eventsCollection: AngularFirestoreCollection<Event>;
  eventDoc: AngularFirestoreDocument<Event>;
  events: Observable<Event[]>;
  event: Observable<Event>;

  constructor(private afs: AngularFirestore) {
    this.eventsCollection = this.afs.collection('events', ref => ref.orderBy('date', 'asc'));
  }

  getEvents(id): Observable<Event[]> {
   // Get events with the client id
   this.events = this.afs.collection('events', ref => ref.where('clientID', '==', id)).snapshotChanges().map(actions => {
   return actions.map(a => {
     const data = a.payload.doc.data() as Event;
     return data;
   })
  });

  return this.events;
}

event.service.ts

events: Event[]

我不确定为什么会抛出这个错误。从我到目前为止看到的内容看,我已声明在OnInit中设置private double b = 1.15; private double g = 0.66; private double c1 = 3424 / Math.pow(2, 12); private double c2 = 2413 / Math.pow(2, 7); private double c3 = 2392 / Math.pow(2, 7); private double n = 2610 / Math.pow(2, 14); private double p = 1.7 * 2523 / Math.pow(2, 5); private double d = -0.56; private double d0 = 1.6295499532821566 * Math.pow(10, -11); public void XYZToJab(double[] xyz, double[] jab) { double[] XYZp = new double[3]; XYZp[0] = b * xyz[0] - ((b - 1) * xyz[2]); XYZp[1] = g * xyz[1] - ((g - 1) * xyz[0]); XYZp[2] = xyz[2]; double[] LMS = new double[3]; LMS[0] = 0.41478972 * XYZp[0] + 0.579999 * XYZp[1] + 0.0146480 * XYZp[2]; LMS[1] = -0.2015100 * XYZp[0] + 1.120649 * XYZp[1] + 0.0531008 * XYZp[2]; LMS[2] = -0.0166008 * XYZp[0] + 0.264800 * XYZp[1] + 0.6684799 * XYZp[2]; double[] LMSp = new double[3]; for (int i = 0; i < 3; i++) { LMSp[i] = Math.pow((c1 + c2 * Math.pow((LMS[i] / 10000.0), n)) / (1 + c3 * Math.pow((LMS[i] / 10000.0), n)), p); } double[] Iab = new double[3]; Iab[0] = 0.5 * LMSp[0] + 0.5 * LMSp[1]; Iab[1] = 3.524000 * LMSp[0] - 4.066708 * LMSp[1] + 0.542708 * LMSp[2]; Iab[2] = 0.199076 * LMSp[0] + 1.096799 * LMSp[1] - 1.295875 * LMSp[2]; jab[0] = (((1 + d) * Iab[0]) / (1 + d * Iab[0])) - d0; jab[1] = Iab[1]; jab[2] = Iab[2]; } public void JabToXYZ(double[] jab, double[] xyz) { double[] Iab = new double[3]; Iab[0] = (jab[0] + d0) / (1 + d - d * (jab[0] + d0)); Iab[1] = jab[1]; Iab[2] = jab[2]; double[] LMSp = new double[3]; LMSp[0] = 1.0 * Iab[0] + 0.13860504 * Iab[1] + 0.05804732 * Iab[2]; LMSp[1] = 1.0 * Iab[0] - 0.13860504 * Iab[1] - 0.05804732 * Iab[2]; LMSp[2] = 1.0 * Iab[0] - 0.09601924 * Iab[1] - 0.81189190 * Iab[2]; double[] LMS = new double[3]; for (int i = 0; i < 3; i++) { LMS[i] = 10000 * Math.pow((c1 - Math.pow(LMSp[i], 1 / p)) / ((c3 * Math.pow(LMSp[i], 1 / p)) - c2), 1 / n); } double[] XYZp = new double[3]; XYZp[0] = 1.92422644 * LMS[0] - 1.00479231 * LMS[1] + 0.03765140 * LMS[2]; XYZp[1] = 0.35031676 * LMS[0] + 0.72648119 * LMS[1] - 0.06538442 * LMS[2]; XYZp[2] = -0.09098281 * LMS[0] - 0.31272829 * LMS[1] + 1.52276656 * LMS[2]; xyz[0] = (XYZp[0] + (b - 1) * XYZp[2]) / b; xyz[1] = (XYZp[1] + (g - 1) * XYZp[0]) / g; xyz[2] = XYZp[2]; } 属性。我假设错误也会显示在第39行,但同样的行在这里工作正常。

1 个答案:

答案 0 :(得分:1)

events变量的范围限定为subscribe块。

this.eventService.getEvents(this.id).subscribe(events => {
  this.events = events;
});
this.client = client;
this.events = events; <-- No events variable here

此外,嵌套订阅块是反模式。考虑将getClient()和getEvents()作为两个独立的流处理。

ngOnInit() {
  const id = this.route.snapshot.params['id'];

  const getClient$ = this.clientService.getClient(id);

  const getEvents$ = getClient$.pipe(
    filter(client => !!client),
    flatMap(() => this.eventsService.getEvents(id))
  );


  getClient$.subscribe(// ... )
  getEvents$.subscribe(// ... )
}

请记住处理您的订阅并取消订阅ngOnDestroy。