Angulaire 2 'composant' n'est pas un élément connu
Je suis en train d'utiliser un composant que j'ai créé à l'intérieur de la AppModule dans d'autres modules. J'obtiens l'erreur suivante si:
"Uncaught (promettre): Erreur: Modèle erreurs d'analyse:
"contacts-box" n'est pas un élément connu:
- Si les contacts de boîte " est une composante Angulaire, puis vérifiez qu'il est partie de ce module.
- Si les contacts de boîte "est un Composant Web puis "CUSTOM_ELEMENTS_SCHEMA' à la '@NgModule.les schémas de la composante de supprimer ce message.
Mon projet de la structure est assez simple:
- Je garder mes pages dans le répertoire des pages, où chaque page est conservée dans les différents module (par exemple, les clients-module) et chaque module dispose de plusieurs composants (comme les clients de la liste des composants, les clients d'ajout de composant et ainsi de suite). Je veux utiliser mon ContactBoxComponent à l'intérieur de ces composants (donc à l'intérieur des clients-ajouter un composant par exemple).
Comme vous pouvez le voir, j'ai créé les contacts de la boîte à l'intérieur de la widgets répertoire donc, c'est essentiellement à l'intérieur de la AppModule. J'ai ajouté le ContactBoxComponent importation d'application.le module.ts et de le mettre dans la liste de déclarations de AppModule. Il ce pas de travail donc je l'ai googlé mon problème et a ajouté ContactBoxComponent pour exporter la liste ainsi. N'a pas aidé. J'ai aussi essayé de mettre ContactBoxComponent dans CustomersAddComponent puis dans l'autre (de l'autre module) mais j'ai une erreur disant qu'il ya plusieurs déclarations.
Ce qui me manque?
- Votre structure de dossier n'est pas simple. C'est déroutant. Je voudrais suggérer Angulaire Style Guide (lien non fournis b/c ils changent) et d'utiliser leur structure de dossier suggestions et assurez-vous que vous êtes en utilisant des modules correctement. Qu'est ce que cela signifie. Vous n'êtes pas à l'exportation ou à la déclaration de votre composant dans un module ingéré par l'application à un certain point.
Vous devez vous connecter pour publier un commentaire.
Ce sont les 5 étapes que j'ai effectuer lorsque j'ai obtenu une erreur.
Vous ne pouvez pas déclarer un composant à deux reprises. Vous devez déclarer et l'exportation de votre composant dans un nouveau module séparé. Ensuite, vous devez importer ce nouveau module chaque module que vous souhaitez utiliser votre composant.
Il est difficile de déterminer quand vous devez créer un nouveau module et quand vous ne devriez pas. J'ai l'habitude de créer un nouveau module pour chaque composante I de la réutilisation. Lorsque j'ai quelques composants que j'utilise presque partout, je les ai mis dans un module unique. Quand j'ai un composant que je ne les réutilisez pas je ne vais pas créer un module séparé jusqu'à ce que j'ai besoin de quelque part d'autre.
S'il peut être tentant de mettre toutes les composantes dans un seul module, ce qui est mauvais pour la performance. Tout en développant un module a pour recompiler à chaque fois que des modifications sont apportées. De plus le module (plusieurs composantes), plus le temps qu'il faut. Faire un petit changement à grand module prend plus de temps que de faire un petit changement dans un petit module.
AppModule
chaque fois que le module racine et toutes les déclarations à l'intérieur sont disponibles pour les enfants de modules? Si je suis confronté au même problème et n'est pas accessible de l'enfant modules, pourquoi devrions-nous créer un autre module et de l'importer de nouveau et de nouveau au lieu d'une seule déclaration de la composante dansAppModule
?Restart the cli
a fonctionné pour moi. Je ne sais pas pourquoi c'est arrivé.Je viens d'avoir exactement le même problème. Avant d'essayer certaines des solutions posté ici, vous pourriez vouloir vérifier si le composant vraiment ne fonctionne pas. Pour moi, l'erreur a été montré dans mon IDE (WebStorm), mais il s'est avéré que le code a fonctionné parfaitement quand je l'ai couru dans le navigateur.
Après que j'ai fermé le terminal (qui était en cours d'exécution ng servir) et redémarré mon IDE, le message n'apparaît plus.
J'ai eu un problème similaire. Il s'est avéré que
ng generate component
(à l'aide de la CLI la version 7.1.4) ajoute une déclaration pour le composant enfant à la AppModule, mais pas pour le Banc de test de module qui émule il.Le "voyage du Héros" exemple d'application contient une
HeroesComponent
avec le sélecteurapp-heroes
. L'application fonctionnait bien servis, maisng test
produit ce message d'erreur:'app-heroes' is not a known element
. L'ajout de laHeroesComponent
manuellement pour les déclarations enconfigureTestingModule
(enapp.component.spec.ts
) élimine cette erreur.J'ai le même problème de la largeur de php storm version 2017.3. Ce correctif pour moi:
intellij forum de support
C'était une erreur largeur @angulaire de la langue de service:
https://www.npmjs.com/package/@angular/language-service
J'ai eu le même problème, et il a été produit en raison de différents modules inclus cette composante par erreur. Lors de la suppression de l'autre fonction, il a travaillé!