I'm having trouble with including a file using ng-include. I've tried various variations, but it keeps returning a 404 error in the console. The directory structure is as follows:
-App
--Layout
---Partials
----Navigation.tpl.html(File)
--Layout.tpl.html(File)
The ng-include code is in the layout.tpl.html
file:
<div data-ng-include="'layout/partials/Navigation.tpl.html'"></div>
It's worth mentioning that I'm using webpack for this project. I'm calling the layout.tpl.html
file as the base layout, and the partials are included inside the layout.tpl.html
file. Additionally, I do not have an ng-app on the DOM:
angular.element(document).ready(() => {
angular.bootstrap(document, ["app"]);
});
Although I have experience with Angular, I am struggling to figure out why such a simple task is taking so long. When I manually insert the minified HTML string from `navigation.tpl.html` into $templateCache, it works fine. However, when attempting to retrieve it using `$templateCache.get()` or `required()`, it does not work. I prefer to update one file rather than rely on minified code stored in the cache.
I apologize if I overlooked something crucial. I am pressed for time and expected this to be a straightforward process.