This is the error I get:
No template specified for component PageNotFoundComponent Error: No template specified for component PageNotFoundComponent at DirectiveNormalizer.normalizeDirective
This module /
component redirect user to homepage and logs them out if route doesnt exist e.g. **
This is my component:
import { Directive} from '@angular/core';
import { Router } from '@angular/router';
import { AuthService } from '../../services/authService/authService';
@Directive({
selector: 'PageNotFoundComponent'
})
export class PageNotFoundDirective {
constructor(_authService: AuthService, _router: Router){
_authService.isAuthenticated().then(() => {
_router.navigate(['/home']);
});
}
}
This is my module
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { RouterModule } from '@angular/router';
import { PageNotFoundDirective } from './pageNotFound.directive';
import { AuthService } from '../../services/authService/authService';
@NgModule({
imports: [CommonModule, RouterModule],
declarations: [PageNotFoundDirective],
exports: [PageNotFoundDirective],
providers: [AuthService]
})
export class PageNotFoundModule { }
This is my routes:
import { Route } from '@angular/router';
import { PageNotFoundDirective } from './index';
export const PageNotFoundRoutes: Route[] = [
{
path: '**',
component: PageNotFoundDirective
}
];
This is the current error I get:
(index):95 Error: (SystemJS) Could not compile 'PageNotFoundDirective' because it is not a component. Error: Could not compile 'PageNotFoundDirective' because it is not a component.
You can simply extend your base component and overwrite the template. This allows you to have different components with the exact same functionality, but different templates. Save this answer.
Angular components are a subset of directives, always associated with a template.
Component metadatalink The metadata for a component tells Angular where to get the major building blocks that it needs to create and present the component and its view. In particular, it associates a template with the component, either directly with inline code, or by reference.
Note Although it's possible for a component to render multiple templates, we recommend using an if:true|false directive to render nested templates conditionally instead. Create multiple HTML files in the component bundle.
update
For a route you need a component (a directive can't be used here)
@Component({
selector: 'PageNotFoundComponent',
template: ''
})
original
There are no components without templates in Angular2
Change
@Component({
to
@Directive({
and you should get what you want.
Components are directives with a view.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With