天天看點

如何找到Angular應用的某個directive是屬于哪一個Angular module

Suppose I would like to use SAP Spartacus directive cxComponentWrapper in my custom Component,and error message is:

Can’t bind to ‘cxComponentWrapper’ since it isn’t a known property of ‘ng-container’.\n1.

如何找到Angular應用的某個directive是屬于哪一個Angular module

This is caused by missing import. However, how can we know which module should be imported from where?

The tip is to check it out in SAP Spartacus source code. Suppose you have already cloned it from github:

https://github.com/SAP/spartacus

search source code by keyword “cxComponentWrapper”, there should be plenty of hits, for example tab-paragraph-container.component.html:

如何找到Angular應用的某個directive是屬于哪一個Angular module

I am using Visual Studio Code for Spartacus development, and installed the plugin Angular Language Service:

如何找到Angular應用的某個directive是屬于哪一個Angular module

With this plugin, simply press Ctrl + mouse left click, to automatically navigate to implementation part of cxComponentWrapper directive, it’s here:

如何找到Angular應用的某個directive是屬于哪一個Angular module

Here we can know cxComponentWrapper directive is exported via module : PageComponentDirective:

如何找到Angular應用的某個directive是屬于哪一個Angular module

As a result, in my application module, just add PageComponentModule into app module’s imports section, and the error is gone:

如何找到Angular應用的某個directive是屬于哪一個Angular module

繼續閱讀