Fehler: [$ compile: tpload] Fehler beim Laden der Vorlage: uib/template/pagination/pagination.html (HTTP-Status: 404 NOT FOUND)

Question

Ich erstelle ein SharePoint-Webpart und wann immer ich mein Webpart in IE mit implementiere meine neue zusätzliche Paginierung Komponente, erhalte ich diesen Fehler:

Hier ist meine MainController.js Datei:

(function() { 
var module = angular.module('StarterProject', ['ngAnimate', 'ui.bootstrap']); 
var MainController = function ($scope, StarterService, $log) { 

    //Pagination 
    $scope.parms = {}; 
    $scope.searchTabs = {}; 
    $scope.selectTier = 1; 
    $scope.itemsPPOptions = [10, 25, 50]; 
    $scope.pager = {}; 
    $scope.pager.currentPage = 1; 
    $scope.pager.itemsPerPage = 25; 
    $scope.pager.maxSize = 10; 

    var updatePage = function (oldval, newval) { 
     var begin = (($scope.pager.currentPage - 1) * $scope.pager.itemsPerPage) 
     var end = begin + $scope.pager.itemsPerPage; 
     if ($scope.UICS && $scope.UICS.length){ 
      $scope.pager.filteredItems = $scope.UICS.slice(begin, end); 
     } 
    }; 

    $scope.$watch('pager.currentPage + pager.itemsPerPage', function() { 
     updatePage(); 
    }); 

    $scope.setPage = function (pageNo) { 
     $scope.currentPage = pageNo; 
    } 

    $scope.pageChanged = function() { 
     $log.log('Page changed to: ' + $scope.currentPage); 
    } 

    //UICS 
    var onGetRegions = function (data) { 
     $scope.UICS = data; 
    }; 

    var includeClosed = true; 
    $scope.UICS = {}; 

    StarterService.GetRegions(includeClosed).then(onGetRegions, onGetRegions); 
}; 

module.controller('MainController', MainController); 

}());
Hier ist mein HTML:

<div data-ng-app="StarterProject"> 
<!--SCRIPTS--> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.js" type="text/javascript"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular-animate.js" type="text/javascript"></script> 
<script src="/_layouts/15/Project3/js/MainController.js" type="text/javascript"></script> 
<script src="/_layouts/15/Project3/js/StarterService.js" type="text/javascript"></script> 
<script src="/_layouts/15/Project3/js/ui-bootstrap.min.js" type="text/javascript"></script> 
<!--STYLE--> 
<link href="/_layouts/15/Project3/styles/bootstrap.min.css" rel="stylesheet" /> 
<link href="/_layouts/15/Project3/styles/bootstrap-theme.min.css" rel="stylesheet" /> 
<link href="/_layouts/15/Project3/styles/DisplayTable.css" rel="stylesheet" /> 
<link href="/_layouts/15/Project3/styles/MainView.css" rel="stylesheet" /> 

<!--FONTS--> 
<link href='https://fonts.googleapis.com/css?family=Josefin+Sans' rel='stylesheet' type='text/css' /> 

<div data-ng-controller="MainController"> 
    <div class="StarterProject"> 
     <div> 
      <table class="table-responsive"> 
       <thead> 
        <tr> 
         <th>UIC </th> 
         <th>UIC KEY </th> 
         <th>ACTIVE NAME </th> 
         <th>UIC SHORT NAME </th> 
         <th>PARENT UIC KEY </th> 
         <th>PARENT UIC </th> 
         <th>SMC Region ID </th> 
         <th>REGION UIC </th> 
         <th>REGION UIC KEY </th> 
         <th>REGION NAME </th> 
         <th>HQ NAME </th> 
         <th>HQ UIC </th> 
         <th>HQ UIC KEY </th> 
         <th>BASE CMD IND </th> 
         <th>NOSC IND </th> 
         <th>USER NAME </th> 
         <th>UPDATED DT </th> 
         <th>JOB LOG ID </th> 
         <th>CREATED DT </th> 
         <th>PARENT NAME </th> 
         <th>INSTALLATION UIC </th> 
         <th>INSTALLATION NAME </th> 
         <th>INSTALLATION UIC KEY </th> 
         <th>SMC INSTALLATION UIC </th> 
         <th>SMC INSTALLATION NAME </th> 
         <th>BASE CMD SC NAME </th> 
         <th>INSTALLATION MAP COORDINATES </th> 
         <th>CLOSED IND </th> 
         <th>JOINT BASE IND </th> 
         <th>SERVICE ID </th> 
        </tr> 
       </thead> 
       <tbody> 
        <tr data-ng-repeat="base in filteredItems | limitTo: 100"> 
         <td data-ng-bind="base.UIC" id="UIC"></td> 
         <td data-ng-bind="base.UIC_KEY" id="UIC_KEY"></td> 
         <td data-ng-bind="base.ACTV_NAME" id="ACTV_NAME"></td> 
         <td data-ng-bind="base.PARENT_UIC_KEY" id="PARENT_UIC_KEY"></td> 
         <td data-ng-bind="base.PARENT_UIC" id="PARENT_UIC"></td> 
         <td data-ng-bind="base.SMC_Region_ID" id="SMC_Region_ID"></td> 
         <td data-ng-bind="base.REGION_UIC" id="REGION_UIC"></td> 
         <td data-ng-bind="base.REGION_UIC_KEY" id="REGION_UIC_KEY"></td> 
         <td data-ng-bind="base.REGION_NAME" id="REGION_NAME"></td> 
         <td data-ng-bind="base.HQ_NAME" id="HQ_NAME"></td> 
         <td data-ng-bind="base.HQ_UIC" id="HQ_UIC"></td> 
         <td data-ng-bind="base.HQ_UIC_KEY" id="HQ_UIC_KEY"></td> 
         <td data-ng-bind="base.BASE_CMD_IND" id="BASE_CMD_IND"></td> 
         <td data-ng-bind="base.NOSC_IND" id="UICNOSC_IND_KEY"></td> 
         <td data-ng-bind="base.USER_NAME" id="USER_NAME"></td> 
         <td data-ng-bind="base.UPDATED_DT" id="UPDATED_DT"></td> 
         <td data-ng-bind="base.JOB_LOG_ID" id="JOB_LOG_ID"></td> 
         <td data-ng-bind="base.CREATED_DT" id="CREATED_DT"></td> 
         <td data-ng-bind="base.PARENT_NAME" id="PARENT_NAME"></td> 
         <td data-ng-bind="base.INSTALLATION_UIC" id="INSTALLATION_UIC"></td> 
         <td data-ng-bind="base.INSTALLATION_NAME" id="INSTALLATION_NAME"></td> 
         <td data-ng-bind="base.INSTALLATION_UIC_KEY" id="INSTALLATION_UIC_KEY"></td> 
         <td data-ng-bind="base.SMC_INSTALLATION_UIC_KEY" id="SMC_INSTALLATION_UIC_KEY"></td> 
         <td data-ng-bind="base.SMC_INSTALLATION_UIC" id="SMC_INSTALLATION_UIC"></td> 
         <td data-ng-bind="base.SMC_INSTALLATION_NAME" id="SMC_INSTALLATION_NAME"></td> 
         <td data-ng-bind="base.BASE_CMD_SC_NAME" id="BASE_CMD_SC_NAME"></td> 
         <td data-ng-bind="base.INSTALLATION_MAP_COORDINATES" id="INSTALLATION_MAP_COORDINATES"></td> 
         <td data-ng-bind="base.Closed_Ind" id="Closed_Ind"></td> 
         <td data-ng-bind="base.Joint_Base_Ind" id="Joint_Base_Ind"></td> 
         <td data-ng-bind="base.Service_ID" id="Service_ID"></td> 
        </tr> 
       </tbody> 
      </table> 
     </div> 
     <uib-pagination total-items="UICS.length" ng-model="pager.currentPage" max-size="pager.maxSize" 
      items-per-page="pager.itemsPerPage" boundary-links="true" rotate="false" previous-text="&lsaquo;" 
      next-text="&rsaquo;" first-text="&laquo;" last-text="&raquo;"></uib-pagination> 
     <div data-ng-show="false" data-ng-include="'/_layouts/15/Project3/styles/Entry.html'"></div> 
    </div> 
</div> 

Ich weiß wirklich nicht, was dieser Fehler bedeutet, oder wie wäre es zu lösen gehen. Ich habe viele ähnliche Fragen zu StackOverflow geprüft, aber ich habe keine einheitliche Lösung oder Antwort gefunden, die speziell für mich funktioniert, und mir erlaubt, die Paginierungsanweisung von Angular UI Bootstrap zu verwenden.

Answer 1

überprüfen Antworten auf diese Frage: ui-bootstrap-tpls failed to load template

try einschließlich TPLS Version von ui.bootstrap

src = "assets/bower_components/Winkel Bootstrap/ui-Bootstrap-tpls.js"