2014-07-24 86 views
7

由於某些原因,模式框工作得很好,但它不會加載我指定的任何模板。Angular-Strap Modal不會加載模板

我的控制器有這個代碼;

var brnSearchModal = $modal({ scope: $scope, template: "app/rrn/searchBrn.html", contentTemplate: false, html: true, show: false }); 

$scope.showModal = function() { 
    brnSearchModal.$promise.then(brnSearchModal.show); 
}; 

我的HTML看起來像這樣;

<button data-ng-click="showModal()" type="button" class="btn btn-info" data-animation="am-fade-and-slide-top"> 
    BRN Lookup 
</button> 

而我的模板是在一個文件中,看起來像這樣;

<div class="modal" tabindex="-1" role="dialog"> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
      <div class="modal-header" ng-show="title"> 
       <button type="button" class="close" ng-click="$hide()">&times;</button> 
       <h4 class="modal-title" ng-bind="title">Hello, World!</h4> 
      </div> 
      <div class="modal-body" ng-bind="content">Lorem ipsum dolor.</div> 
      <div class="modal-footer"> 
       <button type="button" class="btn btn-default" ng-click="$hide()">Close</button> 
      </div> 
     </div> 
    </div> 
</div> 

沒有錯誤一切似乎工作正常,但模板不加載。如果我在一個點上調試角度帶,則模板會加載,但會消失並留下空白模態。

回答

0

嘗試添加BS-模式屬性:看examples

<button data-ng-click="showModal()" type="button" class="btn btn-info" data-animation="am-fade-and-slide-top" bs-modal="brnSearchModal"> 
    BRN Lookup 
</button> 

否則使用數據模板的直接屬性,而不使用JS以顯示模式:

<button type="button" class="btn btn-info" data-animation="am-fade-and-slide-top" data-template="app/rrn/searchBrn.html" bs-modal="modal"> 
    BRN Lookup 
</button> 

我認爲,當你把bs-modal="modal" modal是以某種方式在角度綁定庫中預定義的。

2

從模板中刪除ng-show="title",ng-bind="title"

+0

必須接受的答案 –

0

你應該刪除ng-show="title「,ng-show="content"或從模板ng-bind="title"。您應該確保該模板沒有ng-show

+0

,如果你想顯示模式的標題,請刪除NG -bind-HTML = 「標題」 –