web-dev-qa-db-fra.com

Le bouton ionique affichant le "bouton ionique" n'est pas un élément connu

Je suis nouveau dans ionic, cela semble être une question idiote, mais j’ai besoin d’aide Utiliser un simple bouton c’est une erreur de projection. J'utilise ionic 4.0. 

Le 'bouton ionique' n'est pas un élément connu: 1. Si 'ion-button' est un composant angulaire, vérifiez qu'il fait partie de ce module . 2. Si "ion-button" est un composant Web, ajoutez "CUSTOM_ELEMENTS_SCHEMA" au "@ NgModule.schemas" de ce composant pour supprimer ce message.

<ion-button color="primary">Primary</ion-button>
ionic-frameworkionic4
3
anubhab

Essaye ça,

<button ion-button color="primary">Primary</button>
8
Mangesh Daundkar

Afin d'éviter ce message d'erreur:

  1. Importer CUSTOM_ELEMENTS_SCHEMA dans app.modules.ts:
    import { ErrorHandler, NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
  1. Ajoutez schéma: [CUSTOM_ELEMENTS_SCHEMA] à app.modules.ts comme ci-dessous:
    @NgModule({
      declarations: [
        MyApp,
        HomePage
      ],
      imports: [
        BrowserModule,
        HttpClientModule,
        MomentModule,
        IonicModule.forRoot(MyApp),
      ],
      bootstrap: [IonicApp],
      entryComponents: [
        MyApp,
        HomePage
      ],
      providers: [
        StatusBar,
        SplashScreen,
        {provide: ErrorHandler, useClass: IonicErrorHandler},
      ],
      schemas: [CUSTOM_ELEMENTS_SCHEMA]
    })
1
Gerry R

Il semble que vous n'importiez pas la ionicModule dans le module du composant. Donc, importez la IonicModuledans le module.ts, le reste fonctionnera correctement

1
ram12393

oui essayez ceci

<button ion-button color="primary">Primary</button>
1
tanzeel khalid

J'ai aussi rencontré ça. Votre solution n'est pas la meilleure, car la nouvelle méthode Ionic 4 consiste à utiliser <ion-button> ( https://beta.ionicframework.com/docs/components/#button ).

Cela fonctionne bien pour moi dans une page que j'ai sous /src/app/my-page/my-page.html, mais lorsque je le mets dans /src/shared/components/my-comp/my-comp.html, l'erreur est générée. La chose étrange est que j'ai d'autres éléments ioniques dans la même page <ion-grid>, <ion-row> et <ion-col>. En outre, ce code se trouvait auparavant dans my-page.html où il fonctionnait sans erreur.

FYI, MyComponent est dans components.module.ts comme un declaration et un export. Pas encore sûr de ce qui me manque.

UPDATE 1: le fait de déplacer le répertoire components sous src ni sous src/app n'a fait de différence.

MISE À JOUR 2: Ceci est mon environnement:

   ionic (Ionic CLI)          : 4.0.6
   Ionic Framework            : @ionic/angular 4.0.0-beta.2
   @angular-devkit/core       : 0.7.2
   @angular-devkit/schematics : 0.7.2
   @angular/cli               : 6.1.2
   @ionic/ng-toolkit          : 1.0.0
   @ionic/schematics-angular  : 1.0.1

UPDATE 3: Toujours cassé dans cet environnement:

   ionic (Ionic CLI)          : 4.1.0
   Ionic Framework            : @ionic/angular 4.0.0-beta.3
   @angular-devkit/core       : 0.7.2
   @angular-devkit/schematics : 0.7.2
   @angular/cli               : 6.1.2
   @ionic/ng-toolkit          : 1.0.6
   @ionic/schematics-angular  : 1.0.5

MISE À JOUR 4: Après beaucoup d'essais et d'erreurs, j'ai dû ajouter schemas: [CUSTOM_ELEMENTS_SCHEMA] à mon fichier components.module.ts. J'ai pu quitter la structure de répertoire telle quelle. Je ne sais pas pourquoi cela est nécessaire pour ce scénario, cependant.

1
Russ

J'ai rencontré un problème similaire après ionic 4. J'ai donc ajouté CUSTOM_ELEMENTS_SCHEMA dans app.modules.ts. Ensuite ça a bien fonctionné

app.module.ts 

  providers: [
    StatusBar,
    SplashScreen,
    {provide: ErrorHandler, useClass: IonicErrorHandler},
    SpineRestServiceProvider,
    FingerprintAIO
      ],
  schemas: [CUSTOM_ELEMENTS_SCHEMA]
0
Sahil

Je suis resté coincé là-dessus pendant un petit moment aussi, jusqu'à ce que je réalise que le problème était que je n'avais pas créé le projet Ionic Angular correctement. vous devez inclure --type = angular
https://github.com/ionic-team/ionic-cli

exp: début ionique onglets myApp --type = angular

0
Claudio Teles