I've a few classes I want to be just a plain bean/DTO class, they aren't display @component classes, they're not @Pipe classes nor should they be @Directive (at least I don't think it should be!).
I want to be able to bundle them into a module (they will be used across other modules), but despite several incantations I keep getting errors like this:
When I startup my Angular app (ng serve) it compiles ok, but in the browser (Chrome) console I get an error....
Uncaught Error: Unexpected value 'Accreditation' declared by the module 'ServiceModule'. Please add a @Pipe/@Directive/@Component annotation.
How should I be bundling these classes into a Module for use by other Modules? I don't mind if they are in my service module or in another new 'beans' modules.
Given this module definition (service.module.ts):
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import {MemberService} from "./member/member.service";
import { Accreditation } from "./accreditation";
import {Player} from "./player";
import {Club} from "./club";
import {Coach} from "./coach";
@NgModule({
imports: [CommonModule],
declarations: [Accreditation, Club, Player, Coach],
exports: [Accreditation, Club, Player, Coach],
providers: [MemberService]
})
export class ServiceModule { }
accreditation.ts:
export class Accreditation {
uuid: string;
name :string;
lastComplete: Date;
expires: Date;
inLast6Months: boolean;
type: String;
displayName: String;
hasCompleted: boolean;
}
You don't need to import neither declare your DTOs in app.module.ts. It's available for a direct import in your components, directives, etc.. Simply import it in whichever component/service/directive,pipes you need with other imports:
import { Accreditation } from "./accreditation";
If you wish to share your DTO among several modules, put it in a shared folder and access it with a relative path, i.e.
import { Accreditation } from "./shared/accreditation";