Injecting services across modules, following Angular style guide

Question

Attempting to follow the Angular feature module approach from the style guide I hit a bit of a road block.

Let's say I have two modules with their own CRUD. Products and Vendors.

Each of these modules has files such as the following:

vendors.module.ts.
vendors-routing.module.ts.
vendors.component.ts.
shared/vendor.ts.
shared/vendors.service.ts.

I need to add a vendors drop-down to my product-detail.component.ts in the products module. To populate the drop-down I need to inject the vendors.service.ts from the shared folder in the Vendors module into product-detail.component.ts. This is where I feel like I am doing something wrong.

Should my vendors.service.ts be in another location if I am using it across modules? Should I be creating a vendor drop-down component in the vendor module that is used in the product module? Just trying to figure out if I am technically breaking the rules by doing this or if there is a better way while still keeping the application modular. At this point product module has a dependency on pieces from vendors module regardless...

Answer 1

Should my vendors.service.ts be in another location if I am using it across modules

No. Services are meant to be project wide utilities.