Domanda Non è possibile aggiungere un nuovo componente alla mia app angular 2 con dattiloscritto


Sto usando Angular 2 CLI e ho creato il componente "MyComponent" con il ng generate component MyComponent. Per quanto ne so devo aggiungere il componente alla coppia chiave-valore della direttiva del @Component decoratore, ma la compilazione del dattiloscritto fallisce a questo punto, dicendo che:

ERROR in [default] /Users/Philip/Desktop/Angular2/src/app/app.component.ts:8:2 
Argument of type '{ selector: string; template: any; styles: any[]; directives: typeof MyComponentComponent[]; }' is not assignable to parameter of type 'Component'.
  Object literal may only specify known properties, and 'directives' does not exist in type 'Component'.

Questo è il mio codice per l'app:

import { Component } from '@angular/core';
import { MyComponentComponent } from './my-component/my-component.component'

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
  directives: [MyComponentComponent],
})
export class AppComponent {
  title = 'app works!';
}

Non ho toccato il codice del componente generato, ma nel caso in cui:

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

@Component({
  selector: 'app-my-component',
  templateUrl: './my-component.component.html',
  styleUrls: ['./my-component.component.css']
})

export class MyComponentComponent implements OnInit {

  constructor() {

  }

  ngOnInit() {
  }

}

17
2017-09-15 18:18


origine


risposte:


L'errore stesso lo dice direttive non esistono in  Componente come è stato deprecato. prova questo codice mostrato di seguito,

import { MyComponentComponent } from './my-component/my-component.component'
import {CUSTOM_ELEMENTS_SCHEMA} from '@angular/core';

@NgModule({
   ...
   ...
   declarations:[AppComponent,MyComponentComponent], //<---need to declare 
   schemas:     [CUSTOM_ELEMENTS_SCHEMA]             //<---added this line
})

E rimuovere direttive: [MyComponentComponent] a partire dal AppComponent.


18
2017-09-15 18:21



Il decoratore di componenti Angular2 non li usa più per incorporare altri componenti. Dovremo utilizzare invece un nuovo meta data chiamato entryComponents. Vedi sotto come un esempio ...

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
  entryComponents:[VehicleListComponent]
})

Il componente elenco veicolo ha i seguenti metadati del componente.

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

35
2017-09-25 15:25



se si utilizza la CLI Angolare, il nuovo componente verrà automaticamente importato e aggiunto alla sezione dichiarazioni di @ngmodule in app.module.ts. Non abbiamo bisogno di scrivere alcun codice per questo.


1
2017-12-08 09:56



NON È NECESSARIO FARE NULLA CON ANGOLARE 4 o superiore dopo aver eseguito il comando crea componente. L'errore è molto probabilmente solo se non si utilizza il nome del selettore di destra dal nuovo file di metadati del componente (ad esempio componentname.component.ts).


1
2017-12-30 19:35



Hai due opzioni:

1: usa il tag entryComponents all'interno di Component

2: utilizzare la CLI angolare che lo importa automaticamente, quindi non è necessario scrivere codice per esso.


0
2018-01-06 09:46