Gillardo / bootstrap-ui-datetime-picker

AngularJs directive to allow use of the bootstrap UI date/time pickers in a single dropdown
MIT License
306 stars 168 forks source link

Failed to load template: uib/template/datepicker/datepicker.html #201

Closed fredarend closed 6 years ago

fredarend commented 7 years ago

When I click the button to select the date / time, the dropdown with the calendar / time does not appear and I get the following error in my console:

angular.js:14328 Error: [$compile:tpload] Failed to load template: uib/template/datepicker/datepicker.html (HTTP status: 404 Not Found)
http://errors.angularjs.org/1.6.1/$compile/tpload?p0=uib%2Ftemplate%2Fdatepicker%2Fdatepicker.html&p1=404&p2=Not%20Found
    at angular.js:68
    at handleError (angular.js:19730)
    at processQueue (angular.js:16648)
    at angular.js:16692
    at Scope.$eval (angular.js:17972)
    at Scope.$digest (angular.js:17786)
    at Scope.$apply (angular.js:18080)
    at done (angular.js:12210)
    at completeRequest (angular.js:12436)
    at XMLHttpRequest.requestLoaded (angular.js:12364)
(anonymous) @ angular.js:14328
(anonymous) @ angular.js:10837
handleError @ angular.js:19734
processQueue @ angular.js:16648
(anonymous) @ angular.js:16692
$eval @ angular.js:17972
$digest @ angular.js:17786
$apply @ angular.js:18080
done @ angular.js:12210
completeRequest @ angular.js:12436
requestLoaded @ angular.js:12364
angular.js:14328 Error: [$compile:tpload] Failed to load template: uib/template/datepicker/datepicker.html (HTTP status: 404 Not Found)
http://errors.angularjs.org/1.6.1/$compile/tpload?p0=uib%2Ftemplate%2Fdatepicker%2Fdatepicker.html&p1=404&p2=Not%20Found
    at angular.js:68
    at handleError (angular.js:19730)
    at processQueue (angular.js:16648)
    at angular.js:16692
    at Scope.$eval (angular.js:17972)
    at Scope.$digest (angular.js:17786)
    at Scope.$apply (angular.js:18080)
    at done (angular.js:12210)
    at completeRequest (angular.js:12436)
    at XMLHttpRequest.requestLoaded (angular.js:12364)

Sei que não é um bug, mas não estou conseguindo encontrar o erro do meu código, segue abaixo:

View:

 ```
   <div class="col-md-4" style="margin-left: -14px !important">
          <label class="m_top10">Data e Hora:</label>
          <p class="input-group">
            <input type="text" class="form-control" ng-click="vm.openCalendar($event, prop)" datetime-picker="dd MMM yyyy HH:mm" ng-model="vm.myDate" is-open="vm.isOpen"/>
            <span class="input-group-btn">
                <button type="button" class="btn btn-default" ng-click="vm.openCalendar($event, prop)"><i class="fa fa-calendar"></i></button>
            </span>
          </p>
   </div>
Controller:
    var vm = this;

    vm.isOpen = false;

    vm.openCalendar = function(e) {

        e.preventDefault();
        e.stopPropagation();

        vm.isOpen = true;        
    };
mikatuo commented 7 years ago

The datetime picker is dependent upon UI Bootstrap. You need to either take UI Bootstrap's templates or use -tpls files that contain the templates bundled in JavaScript. You can find and read more about the -tpls files here.