我是 ionic 新手，这似乎是一个愚蠢的问题，但我需要一些帮助 使用一些简单的按钮会引发错误。我正在使用离子 4.0。
'ion-button' 不是已知元素： 1. 如果 'ion-button' 是一个 Angular 组件，那么验证它是这个模块的一部分。 2. 如果“ion-button”是一个 Web 组件，则将“CUSTOM_ELEMENTS_SCHEMA”添加到该组件的“@NgModule.schemas”以禁止显示此消息。
<ion-button color="primary">Primary</ion-button>
【问题讨论】：
试试这个，
<button ion-button color="primary">Primary</button>
【讨论】：
为了避免该错误消息：
import { ErrorHandler, NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
@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]
})
【讨论】：
我认为解决方案是在相应的模块导入中导入 Ionic 模块
import { IonicModule } from '@ionic/angular'; <--add this line
@NgModule({
imports: [
CommonModule,
FormsModule,
IonicModule, <-- add this line
],
})
【讨论】：
我也遇到过。您的解决方案不是最好的，因为新的 Ionic 4 方法是使用 <ion-button> (https://beta.ionicframework.com/docs/components/#button)。
在我在/src/app/my-page/my-page.html 下的页面中它确实对我有用，但是当我把它放在/src/shared/components/my-comp/my-comp.html 中时它给出了错误。奇怪的是我在同一页<ion-grid>、<ion-row> 和<ion-col> 中有其他离子元素。此外，此代码曾经位于 my-page.html 中，它可以正常工作。
仅供参考，MyComponent 在components.module.ts 中作为declaration 和export。还不知道我错过了什么......
更新 1：将 components 目录移动到 src 和 src/app 下都没有任何区别。
更新 2：这是我的环境：
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
更新 3：在这种环境中仍然存在问题：
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
更新 4：经过反复试验，我不得不将 schemas: [CUSTOM_ELEMENTS_SCHEMA] 添加到我的 components.module.ts 文件中。我能够保持原样的目录结构。不过，我不确定为什么这种情况需要这样做。
【讨论】：
您似乎没有在组件模块中导入ionicModule。所以，在module.ts中导入IonicModule，其他的都可以正常使用
【讨论】：
是的，试试这个
<button ion-button color="primary">Primary</button>
【讨论】：
在 Ionic 5 中，我在使用 --prod 选项构建时遇到了同样的问题。
由于 *.module.ts 文件在 Ionic 5 的组件中不可用，我需要为组件添加共享模块，然后将 CUSTOM_ELEMENTS_SCHEMA 架构添加到该共享模块。
ionic g module modules/shared
cat shared.module
import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FooComponent } from '../../components/foo/foocomponent.component'; <== Add your components
@NgModule({
declarations: [FooComponent], <== Add your components
imports: [
CommonModule
],
exports: [FooComponent], <== Add your components
schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
export class SharedModule { }
【讨论】：
在父模块中导入您的自定义组件。例如在您的 app.module.ts 中：
declarations: [MyComponent],
exports: [
PopoverComponent,
]
【讨论】：
我的问题是，在此错误之前出现了一些错误，这些错误似乎是级联的。我遇到的错误是声明中应该包含在提供程序中的一些元素。此外，其中一个在构造函数中被标记为私有，而它应该是公开的。
@NgModule({
imports: [
IonicModule,
CommonModule,
FormsModule,
RouterModule.forChild([{ path: '', component: DevicesPage }]),
DevicesPageRoutingModule,
TranslateModule.forChild()
],
declarations: [DevicesPage --> remove BLE, LocationAccuracy, DeviceManagerService ],
providers: [BLE, LocationAccuracy, DeviceManagerService] <--Add
})
【讨论】：
在我意识到问题是我没有正确创建 Ionic Angular 项目之前，我也被困了一段时间。你必须包括 --type=angular
https://github.com/ionic-team/ionic-cli
表达式： ionic start myApp tabs --type=angular
【讨论】：
我在 ionic 4 之后遇到了类似的问题，所以我在 app.modules.ts 中添加了 CUSTOM_ELEMENTS_SCHEMA。然后效果很好
app.module.ts
providers: [
StatusBar,
SplashScreen,
{provide: ErrorHandler, useClass: IonicErrorHandler},
SpineRestServiceProvider,
FingerprintAIO
],
schemas: [CUSTOM_ELEMENTS_SCHEMA]
【讨论】：
应该在 app.module.ts 中添加
import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
providers: [
StatusBar,
SplashScreen,
{ provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
],
schemas: [CUSTOM_ELEMENTS_SCHEMA] ==> add line**
【讨论】：