2
votes

Chargement d'un autre composant autre que le composant App dans Angular

Je veux charger le composant FleshScreenComponent dans le projet Angular dans un premier temps en remplaçant Appcomponent donc pour cela je le fais en

import { BrowserModule } from '@angular/platform-browser';
import { NgModule, NO_ERRORS_SCHEMA } from '@angular/core';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';

import { ReactiveFormsModule, FormsModule } from '@angular/forms';
import { HttpClientModule }    from '@angular/common/http';
import { LoginComponent} from './LoginComponent/LoginComponent.component';
import { FleshScreenComponent} from './FleshScreenComponent/FleshScreenComponent.component';



@NgModule({
  declarations: [
    AppComponent,

    LoginComponent,
    FleshScreenComponent,


  ],
  imports: [

  ],
  entryComponents:[
    LoginComponent, PaymentComponent
  ],
  schemas: [ NO_ERRORS_SCHEMA ],
  providers: [ServicesService ,CommonStorageService,  {provide: MatDialogRef, useValue: {} }],
  bootstrap: [FleshScreenComponent],

})
export class AppModule { }

mais je ne suis toujours pas capable de le faire

pour le je mets mon code complet à partir du fichier app.module.ts.

 bootstrap: [FleshScreenComponent],

typescript angular angular6 angular7 angular5

2 commentaires

y a-t-il une erreur que vous rencontrez dans ng serve ou dev console?

@Sivaramakrishnan Je suis en train de gronder erroe - >>>>>: Le sélecteur "app-FleshScreen" ne correspond à aucun élément

3 Réponses :

-1
votes

Dans la méthode ngOnInit d'AppComponent, vous pouvez rediriger par programme vers votre FleshScreenComponent si vous utilisez le routage.

6 commentaires

Je peux le faire mais je veux charger un autre composant

Quel composant souhaitez-vous charger?

ChairÉcranComposant

C'est ce vers quoi vous pouvez rediriger dans l'Appcomponent. Ce faisant, il charge votre composant au lieu de appcomnponent

Ce n'est pas une réponse que @TestingAnurag recherche. Si vous avez cette suggestion, mettez-la en commentaire et non en réponse

C'est une question de compréhension. C'est une réponse parfaite que j'utilise actuellement.

1
votes

Jetez un œil à cette démo.

Vous devez fournir le sélecteur de FleshScreenComponent dans index.html quelque chose comme ce que j'ai fait dans ma démo pour HelloComponent

<hello>loading</hello>

0 commentaires

0
votes

Vous pouvez utiliser Routes pour charger le composant requis au démarrage de l'application. Cela donnerait à l'application une meilleure structure.

mettez ceci dans app-routing.module.ts

routes const: Routes = [{chemin: '', composant: FleshScreenComponent}];

et ceci dans app.component.html

<router-outlet>
</router-outlet>

Enfin, n'oubliez pas d'importer votre module de routage dans app.module car je vois que cette importation est absente de votre code.

0 commentaires