Javascript `财产'；活生生的'；应用程序编译中不存在`

当我尝试运行angular应用程序时，我得到的错误如下：

ERROR in src/app/new-card-input/new-card-input.component.ts(25,24): error TS2339: Property 'alive' does not exist on type 'NewCardInputComponent'.

这里的问题是什么

这是我的密码：

import { Component, EventEmitter, OnInit, Output, HostListener, ViewChild } from '@angular/core';
import {NgForm, FormBuilder, FormGroup, Validators} from '@angular/forms';
import { takeWhile, debounceTime, filter } from 'rxjs/operators';


@Component({
    selector: 'app-new-card-input',
    templateUrl: './new-card-input.component.html',
    styleUrls: ['./new-card-input.component.scss'],
    host: {'class': 'col-4'}
})
export class NewCardInputComponent implements OnInit {

    newCardForm: FormGroup;
    @ViewChild('form') public form:NgForm;

    constructor(fb:FormBuilder) {
        this.newCardForm = fb.group({
            'text': ['', Validators.compose([Validators.required, Validators.minLength(2)])],
        });

        this.newCardForm.valueChanges.pipe(
        filter((value) => this.newCardForm.valid),
        debounceTime(500),
        takeWhile(() => this.alive)
        ).subscribe(data => {
            console.log(data);
        });
    }

    public newCard:any = {text:''}

    @Output() onCardAdd = new EventEmitter<string>();

    @HostListener('document:keypress', ['$event'])
    handleKeyboardEvent(event: KeyboardEvent) {
        if (event.code === "Enter" && this.newCardForm.valid) {
            this.addCard(this.newCardForm.controls['text'].value);
        }
    }

    addCard(text) {
        this.onCardAdd.emit(text);
        this.newCardForm.controls['text'].setValue('');
    }



    ngOnInit() {}

}

从'@angular/core'导入{Component，EventEmitter，OnInit，Output，HostListener，ViewChild}；
从'@angular/forms'导入{NgForm，FormBuilder，FormGroup，Validators}；
从'rxjs/operators'导入{takeWhile，debounceTime，filter}；
@组成部分({
选择器：“应用程序新卡输入”，
templateUrl:'./new card input.component.html'，
styleUrls:['./新卡输入.component.scss']，
主机：{'class'：'col-4'}
})
导出类NewCardInputComponent实现OnInit{
新卡形式：FormGroup；
@ViewChild（“表单”）公共表单：NgForm；
构造函数（fb:FormBuilder）{
this.newCardForm=fb.group({
'text'：[''，Validators.compose（[Validators.required，Validators.minLength（2）]），
});
this.newCardForm.valueChanges.pipe(
过滤器（（值）=>this.newCardForm.valid），
去BounceTime（500），
takeWhile（（）=>this.alive）
).订阅（数据=>{
控制台日志（数据）；
});
}
公共新卡：any={text:'}
@Output（）onCardAdd=neweventemitter（）；
@HostListener（'文档：按键'，['$event']））
handleKeyboardEvent（事件：KeyboardEvent）{
if（event.code==“Enter”&&this.newCardForm.valid）{
this.addCard（this.newCardForm.controls['text'].value）；
}
}
添加卡（文本）{
this.onCardAdd.emit（文本）；
this.newCardForm.controls['text'].setValue（''）；
}
ngOnInit（）{}
}

---

有人帮我吗？

您需要定义

private alive=true以下是您正在学习的教程代码的当前步骤

从'@angular/core'导入{Component，EventEmitter，OnInit，Output，HostListener，ViewChild}；
从'@angular/forms'导入{NgForm，FormBuilder，FormGroup，Validators}；
从'rxjs/operators'导入{takeWhile，debounceTime，filter}；
@组成部分({
选择器：“应用程序新卡输入”，
templateUrl:'./new card input.component.html'，
styleUrls:['./新卡输入.component.scss']，
主机：{'class'：'col-4'}
})
导出类NewCardInputComponent实现OnInit{
新卡形式：FormGroup；
私生活=真；
@ViewChild（“表单”）公共表单：NgForm；
构造函数（fb:FormBuilder）{
this.newCardForm=fb.group({
'text'：[''，Validators.compose（[Validators.required，Validators.minLength（2）]），
});
this.newCardForm.valueChanges.pipe(
过滤器（（值）=>this.newCardForm.valid），
去BounceTime（500），
takeWhile（（）=>this.alive）
).订阅（数据=>{
控制台日志（数据）；
});
}
公共新卡：any={text:'}
@Output（）onCardAdd=neweventemitter（）；
@HostListener（'文档：按键'，['$event']））
handleKeyboardEvent（事件：KeyboardEvent）{
if（event.code==“Enter”&&this.newCardForm.valid）{
this.addCard（this.newCardForm.controls['text'].value）；
}
}
添加卡（文本）{
this.onCardAdd.emit（文本）；
this.newCardForm.controls['text'].setValue（''）；
}
ngOnInit（）{}
}
您正在调用此函数。alive但之前未声明alive。如何声明它？我想那是来自
rxjs
。不是吗？不是，它是一个局部范围属性。您可以将其添加到newCardForm:FormGroup；只需添加以下内容；错误会消失，尽管查看代码可能会发现其他错误。。。
import { Component, EventEmitter, OnInit, Output, HostListener, ViewChild } from '@angular/core';
import {NgForm, FormBuilder, FormGroup, Validators} from '@angular/forms';
import { takeWhile, debounceTime, filter } from 'rxjs/operators';


@Component({
    selector: 'app-new-card-input',
    templateUrl: './new-card-input.component.html',
    styleUrls: ['./new-card-input.component.scss'],
    host: {'class': 'col-4'}
})
export class NewCardInputComponent implements OnInit {

    newCardForm: FormGroup;
    private alive = true;
    @ViewChild('form') public form:NgForm;

    constructor(fb:FormBuilder) {
        this.newCardForm = fb.group({
            'text': ['', Validators.compose([Validators.required, Validators.minLength(2)])],
        });

        this.newCardForm.valueChanges.pipe(
        filter((value) => this.newCardForm.valid),
        debounceTime(500),
        takeWhile(() => this.alive)
        ).subscribe(data => {
            console.log(data);
        });
    }

    public newCard:any = {text:''}

    @Output() onCardAdd = new EventEmitter<string>();

    @HostListener('document:keypress', ['$event'])
    handleKeyboardEvent(event: KeyboardEvent) {
        if (event.code === "Enter" && this.newCardForm.valid) {
            this.addCard(this.newCardForm.controls['text'].value);
        }
    }

    addCard(text) {
        this.onCardAdd.emit(text);
        this.newCardForm.controls['text'].setValue('');
    }



    ngOnInit() {}

}