ts2304找不到名字'OnInit'

时间:2017-03-29 21:22:06

标签: node.js angular typescript

我已经完成了Angular超级英雄教程。一切正常。

如果我关闭运行NPM的cmd窗口,然后重新打开CMD窗口并重新发出NPM START命令我收到两个错误

src/app/DashBoard.component.ts(12,44)  TS2304 : Cannot find name 'OnInit'.
src/app/hero-list.component.ts(16, 434)  TS2304 : Cannot find name 'OnInit'.

我可以通过删除

来解决这个问题
Implements OnInit

来自这两个班级, 运行NPM启动 重新添加它们(在编辑器中只是CTL Z) 做一些改变,保存。 该应用程序重新编译,我正在运行。

我有4个实现此功能的类。我研究了它们,无法弄清楚是什么让2失败......

我已经阅读了参考TS2304的帖子,但这似乎是一个通用的函数/变量/符号未找到的消息......

我不知道该发布什么。我很乐意发布任何代码。
这是由模块中的错误引起的,这取决于(hero.ts)吗?

这是一个以这种方式失败的类。 这是hero-list.component.ts文件 (在演示/在线示例中的各个点,这也称为Heroes.component ..)

import { Component } from '@angular/core';
import { Router } from '@angular/router';

import { Hero  } from './hero';
import { HeroService  } from './hero.service';

@Component({
  selector: 'hero-list',
  templateUrl: './hero-list.component.html' ,
  providers: [HeroService],
  styleUrls: [ './hero-list.component.css']
})



export class HeroListComponent implements OnInit   {

    heroes : Hero[];
    selectedHero: Hero;

    constructor(
        private router : Router ,
        private heroService: HeroService
        ) { }

    ngOnInit(): void {
        this.getHeroes();
    }

    onSelect(hero: Hero): void {
        this.selectedHero = hero;
    }

    getHeroes(): void {
        this.heroService.getHeroes().then(heroes => this.heroes = heroes);
    }

    gotoDetail() {
        this.router.navigate(['/detail', this.selectedHero.id]);
    }

    add(name: string): void {
        name = name.trim();
        if (!name) { return; }
        this.heroService.create(name)
            .then(hero => {
                this.heroes.push(hero);
                this.selectedHero = null;
            });
    }
    delete(hero: Hero): void {
        this.heroService
            .delete(hero.id)
            .then(() => {
                this.heroes = this.heroes.filter(h => h !== hero);
                if (this.selectedHero === hero) { this.selectedHero = null; }
            });
    }
}

4 个答案:

答案 0 :(得分:38)

您必须导入OnInit。

import { Component, OnInit } from '@angular/core';

答案 1 :(得分:8)

tutorial未提及您需要将OnInit的导入添加到TypeScript文件 app.component.ts

import { Component, OnInit } from '@angular/core';

答案 2 :(得分:0)

您必须在 ts 部分导入 OnInit。

import { Component, OnInit } from '@angular/core';

答案 3 :(得分:-1)

只需导入OnInit

import { Component, OnInit } from '@angular/core';