Angular ui bootstrap directive template missing

Question

I\'m currently testing out angular bootstrap-UI locally on my machine. When I try to recreate the example of accordion and dialog box. I get this error message

Answer 1

You have two choices:

1. If you don't want to make your own templates and want the built in ones, you should download the ui-bootstrap-tpls-0.1.0.js file - this injects all the templates so they are pre-cached into your app: https://github.com/angular-ui/bootstrap/blob/gh-pages/ui-bootstrap-tpls-0.1.0.js#L1322

2. If you do want to make some of your own templates, create a templates folder in your app, and download the templates from the angular-ui/bootstrap project. Then overwrite the ones you want to customize on your own.

Read more here: https://github.com/angular-ui/bootstrap/tree/gh-pages#build-files

edit:

You can also download bootstrap-tpls.js and still overwrite some of the directive's templateUrls with your own, using an AngularJS decorator to change the directive's templateUrl. Here's an example that change's datepicker's templateUrl:

http://docs.angularjs.org/api/AUTO.$provide#methods_decorator

myApp.config(function($provide) {
  $provide.decorator('datepickerDirective', function($delegate) {
    //we now get an array of all the datepickerDirectives, 
    //and use the first one
    $delegate[0].templateUrl = 'my/template/url.html';
    return $delegate;
  });
});