Angular 6 directive is not initialized when placed in lazy loaded module's component

I see there is an issue with your design. Instead of having your directive in the AppModule, create a SharedModule and then implement the directive in there. Import SharedModule everywhere else in your app. This way you can access your directive from external components (from other modules).

Make sure you declare and export it inside SharedModule

I thought if anything declared in app module should be available to all modules

No this is not correct, Child modules does not know what you have inside the AppModule. ChildModule's are just another independent modules like AppModule. You could have simply exposed AppModule to ChildModule, but that might cause the circular dependency. That is the reason you have to make use of SharedModule