0

https://angular-ui.github.io/bootstrap/#/modal을 사용하지만 내 모달이 나타나지 않습니다. 작품 - '../contact-app/templates/modal.create.tpl.html': 여기 enter image description here앵귤러 부트 스트랩 ui 모달이 표시되지 않습니다.

내 JS됩니다 :

app.controller('PersonListController', ['$scope','ContactService','$uibModal', function($scope,ContactService,$uibModal){ 
 

 

 

 
    $scope.showCreateModal =function() { 
 

 
     $scope.createModal = $uibModal.open({ 
 
      templateUrl: '../contact-app/templates/modal.create.tpl.html', 
 
      bindToController: true, 
 
      size: 'lg' 
 
      }); 
 
    }; 
 

 

 

 
}]);

HTML 여기에있는 이미지입니다 나는 invisable 페이지의가 있지만 검사 할 때

<div class="modal fade" data-keyboard="false" data-backdrop="static"> 
 
\t <div class="modal-dialog"> 
 
\t \t <div class="modal-content"> 
 
\t \t \t <div class="modal-header"> 
 
\t \t \t \t <h4 class="modal-title">Modal Title</h4> 
 
\t \t \t </div> 
 
\t \t \t <div class="modal-body"> 
 
\t \t \t \t <ng-include src="'templates/form.html'"></ng-include> 
 
\t \t \t </div> 
 
\t \t </div> 
 
\t </div> 
 
</div>

통상의 부트 스트랩 모달을 사용하면 효과가 있습니다 만, 모서리를 사용하면 도움이되지 않습니다!

+0

콘솔에서 오류가 발생 하였다? – developer033

+0

아니요, 콘솔에 오류가 없습니다. – Mikail

답변

0

템플릿에 상대 URL을 사용하려는 것 같습니다. 대신 다음과 같은 방법을 사용한다 :

당신의 HTML에서 :

<script type="text/ng-template" id="modal.create.tpl.html"> 
    <div> 
    Modal content 
    </div> 
</script> 

다음 템플릿 캐시에 템플릿을로드하고 당신이 그것을 참조합니다 각도는 다음과 같습니다

templateUrl: 'modal.create.tpl.html' 
0

내가 ' 이 코드로 작업하게 만들었습니다 :

$scope.createModal = $uibModal.open({ 
     templateUrl: '../contact-app/templates/modal.create.tpl.html', 
     bindToController: true, 
     scope: $scope 

     }); 

'../contact-app/templates/modal.crea te.tpl.html '

확실히 여전히
<div class="modal-header" ng-controller="PersonListController"> 
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
      <h4 class="modal-title">Modal title</h4> 
     </div> 
     <div class="modal-body"> 

      <ng-include src="'templates/form.html'"></ng-include> 
     </div> 
     <div class="modal-footer"> 
      <button type="button" class="btn btn-default" ng-click="ok()">Close</button> 
      <button type="button" class="btn btn-primary" ng-click="close()">Save changes</button> 
     </div> 

문제가 아니라

관련 문제