Angular $templatecache name conflicts

0
votes

We have a single page application structure with multiple html templates. Multiple developers are pushing their own submodules to app and during bundling process (webpack) we are pushing all these templates to $templatecache.

Inevitably some of the apps partials happen to have same names (dashboard, nav, section etc) and angular is overwriting the templates.

Is there a way to avoid name conflicts during angular template caching process? Or is there any gulp-grunt etc plugin to create unique template names and match-replace them in the htmls?

1
javascriptangularjscaching
well, the simple way I can think of is to give your template a long name... the name would start with the name of the module that the template pertains to. Also, you could place the partials into separate folders and have them referenced from those folders, just define a grunt task which copies the folder structure. - SoluableNonagon

1 Answers

0
votes

well, try out longer names which won't conflict...

dashboard, nav, section are generic and will easily conflict

try:

dashboard-for-admin-page, nav-for-submodule-alpha-0, section-right-of-main-page, etc

The way my team does it is we have a folder structure for each module with complex names

Example:

/partials
----/global-partials
--------/header-global.html
--------/footer-global.html
----/main-page
--------/index-for-main-page.html
--------/partial-header-on-main-page.html
--------/left-pane-on-main-page.html
----/about-us-page
----/cart-page
----/search-page