Wondering how to resolve ts1206 decorators are not valid here Error in Angular.js? We can help you.

At Bobcares, we offer solutions for every query, big and small, as a part of our Server Management Service.

Today, let’s take a look at how our Support Team help a customer  deal with this error.

How to resolve ts1206 decorators are not valid here Error in Angular.js?

Usually, decorators follow the form @expression, where expression evaluates to a function called at runtime with information about the decorated declaration.

Then in Angular, you might know about these decorators: @Component, @Pipe, @Directive, @Injectable, and @NgModule.

In order to solve this issue, we need the decorator to placed directly before an exported class.

Today, let us see the errors discussed by our Support Techs and possible resolutions.

Errors with @Component

@Component({
...
})
export class myComponent {}

First and foremost, we can’t have any other declarations in between the two.

The following setup will return the error.

@Component({
...
})
export interface myInterface {}
export class myComponent {}

Errors with @NgModule

Next, in the case of the .module.ts, we might encounter this issue if we improperly set up Angular routes.

Then, make sure to define the routes before the @NgModule decorator, rather than after.

const routes: Routes = [
{ path: '', redirectTo: '/home', pathMatch: 'full' },
{ path: 'home', component: HomeComponent }
];
@NgModule({
declarations: [
AppComponent,
HomeComponent
],
imports: [
RouterModule.forRoot(routes)
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule {}

[Need a solution to another query? We are just a click away.]

Conclusion

Today, we saw steps followed by our Support Engineers in order to resolve the ts1206 decorators are not valid here Error in Angular.js.