web-dev-qa-db-fra.com

ts2304 ne trouve pas le nom 'OnInit'

J'ai suivi le didacticiel Angular sur les super-héros. Tout fonctionne. 

Si je ferme la fenêtre cmd sur NPM, rouvrez une fenêtre CMD et relancez la commande NPM START. Deux erreurs se produisent. 

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'.

Je peux résoudre ce problème en supprimant 

Implements OnInit

à partir de ces deux classes, lance NPM start rajoutez-les (simplement CTL Z dans l'éditeur) apportez des modifications, enregistrez. L'application recompile et je suis en marche.

J'ai 4 classes qui implémentent cette fonction. Je les ai étudiés et je ne peux pas comprendre ce qui fait échouer deux ...

J'ai lu des articles qui font référence à TS2304, mais cela semble être un message générique Fonction/Variable/Symbole non trouvé ...

Je ne sais pas quoi poster. Je suis heureux de poster n'importe quel code.
Est-ce causé par des erreurs dans les modules qui dépendent de (hero.ts)? 

Voici une classe qui échoue de cette manière. Il s’agit du fichier hero-list.component.ts (À différents moments des exemples de démonstration/en ligne, il s’appelle également 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; }
            });
    }
}
node.jsangulartypescript
10
greg

Vous devez importer OnInit.

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

Le tutorial omet de mentionner que vous devez ajouter l'importation de OnInit dans le fichier TypeScript app.component.ts:

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

Il suffit d'importer OnInit

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