【Angular】Angular+Ionic报错:No provider for *Service!

1.报错信息:

ERROR Error: Uncaught (in promise): Error: No provider for TrainService!
Error: No provider for TrainService!

【Angular】Angular+Ionic报错:No provider for *Service!_第1张图片

第二个信息:
【Angular】Angular+Ionic报错:No provider for *Service!_第2张图片

2.解决方案:

去报错信息中提到的TrainService.ts文件中,添加provider;具体如下:

【Angular】Angular+Ionic报错:No provider for *Service!_第3张图片

3.源代码:

在module.ts文件中添加providers:

import {NgModule} from "@angular/core";
import {IonicPageModule} from "ionic-angular";
import {SharedModule} from "../../../platform/common/shared.module";
import {TrainingRecordComponent} from "./trainingRecord";
import {TrainService} from "../train.service";//②这里一般会自动导入,如果不能自动导入,要自己手动从文件夹下导入TrainService;

@NgModule({
  imports:  [SharedModule,IonicPageModule.forChild(TrainingRecordComponent)],
  declarations: [TrainingRecordComponent],
  providers:[TrainService]//①在这里添加providers
})
export class TrainingRecordModule {

}

4.总结:

这里我们用A来代表你具体的文件名

  1. A.service.ts(含有A.service)
  2. A.ts(含有Acomponent)
  3. A.module.ts
  4. A.scss

四个文件,其中module和Component都是组件的意思;容易弄混淆;我的理解的是,module是父组件,component是子组件,可以翻译成元件;为什么,从imports,declarations,providers可以看出,后缀都带s,module.ts文件是父,有好多子;但是一个子,不可能有好多血缘意义上的父(不然会很可怕);

1.imports:表示导入的外部结构,架构;比较宏大一些的;在module.ts文件中,写入要导入的外部包;
2.Declarations:表示父子关系,通过具体的A.ts中的Acomponnent来实施具体方法,父亲来购买原料,儿子来制作;
3.providers:表示,方法的提供者,一般都是具体的service;比如A.service;

你可能感兴趣的:(【报错】,【Angular】,【Ionic】)