I have created a custom directive that I want to use throughout my application. How can I register my directives so they are accessible in the entire application? I have found outdated solutions for this issue and need a solution specific to Angular 2 final version 2.1.0.
Here is an excerpt from my main.ts file:
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { enableProdMode } from '@angular/core';
import { AppModule } from './app.module';
//enableProdMode(); //Uncomment for production
platformBrowserDynamic().bootstrapModule(AppModule)
.then((success: any) => console.log('App bootstrapped'))
.catch((err: any) => console.error(err));
My application consists of 6 modules for lazy loading purposes:
appmodule
--contact module
--project module
--restmodules
...
Initially, when I registered the directive in the product module, it worked well. To use this directive in other modules, I registered it in my appmodule.ts as shown below:
import { mdinput} from './shared/mdinput.directive';
@NgModule({
imports: [
AppRoutingModule
],
declarations: [
AppComponent,mdinput
],
providers: [DataService],
bootstrap: [AppComponent]
})
export class AppModule {
}
Currently, this particular directive is not functioning properly without any error messages being displayed.