I am trying to use ui-bootstrap.min.js with the external templates.

The error I am getting is:

http://localhost:13132/Place/template/timepicker/timepicker.html 404 (Not Found) 

I would like for every page, for every template, it to look for my templates under:

http://localhost:13132/js/app/template/...

but I cannot seem to find where I could change the location where this is pointing to.

Anyone know how to make this change?

I am trying to use ui-bootstrap.min.js with the external templates.

The error I am getting is:

http://localhost:13132/Place/template/timepicker/timepicker.html 404 (Not Found) 

I would like for every page, for every template, it to look for my templates under:

http://localhost:13132/js/app/template/...

but I cannot seem to find where I could change the location where this is pointing to.

Anyone know how to make this change?

• javascript
• angularjs
• angular-ui

3 Answers 3

This can be handled using $provide.decorator

Read more about this issue: https://github./angular-ui/bootstrap/issues/743

myApp.config(function($provide) {
  $provide.decorator('datepickerDirective', function($delegate) {
    //array of datepicker directives
    $delegate[0].templateUrl = "my/datepicker.html";
    return $delegate;
  });
});

Update: I've tested this solution and it does work for other templates as well, and only requires those small changes to app.js. I've tested this now with timepicker.html and day.html, defining a decorator for timepickerDirective and daypickerDirective. The latter is used to override the calendar table display. The templateUrl path is relative to your app folder, in my case it was "partials/fragments/day.html".

Per this issue on github, the templateUrl is not configurable. You could change the templateUrl property in each directive definition

.directive('accordion', function () {
    return {
        restrict:'EA',
        controller:'AccordionController',
        transclude: true,
        replace: false,
        templateUrl: 'template/accordion/accordion.html'
 };

but that would be brittle and hard to maintain. Unfortunately, it doesn't look like they're going to make this configurable - but the thread is an interesting read.

Another alternative without changing code is to add some sort of virtual server directory that maps /Place/template to your actual location of /js/app/template/

The implementation of virtual directories is obviously in your server platform of choice.