AngularJS uiModal embedded template

https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js
https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js
https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/1.0.3/angular-ui-router.js
https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js
//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-1.3.3.js

Using these versions of angularJS and bootstrap. My uiModal only wants to look externally.
When I check the GET requests, it’s looking for the templateUrl from the server.
The templateUrl is within script tags in the index.html

This is within my app.run()

let modalInstance = $uibModal.open({
animation: true,
templateUrl: 'example.html'});

And this is within my index.html, within the body.

<script type="text/ng-template" id="example.html">
<div>
    Example
</div></script>

In fact, even if I just try template: ‘foo’ , it still doesn’t work.

Must be something small I’m missing, this isn’t a problem in other projects… although maybe different versions of angularJS.

Source: AngularJS Questions