2017-08-17 31 views
0

我正嘗試擺脫模態變量的其他模式,這是MI模式:通行證可變模態

<div id="contentModal" class="modal fade" > 
     <div class="modal-content animate" tabindex="-1"> 
      <div class="modal-container-"> 
       <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal">&times;</button> 
       <h1>Issue: {{selected_issue.Issue}}</h1> 
       </div> 
       <div class="modal-body row"> 
        <div class="col-md-5"> 
         <h5 style="text-align: center;">Descripción</h5>     
         <p1>{{selected_issue.Descripcion}}</p1> 
         </div> 
         <div class="col-md-5"> 
         <h5 style="text-align: center;">Solución</h5> 
         <p1>{{selected_issue.Solucion}}</p1> 
         </div> 


        <div id="modalSpec"class="col-md-2"> 
         <h6>OpCo:</h6> 
         <p1>{{selected_issue.opCo}}</p1> 
         <h6>Tecnologia:</h6> 
         <p1>{{selected_issue.Tecnology}}</p1> 
         <h6>Version:</h6> 
         <p1>{{selected_issue.Version}}</p1> 
         <h6>Estado:</h6> 
         <p1>{{selected_issue.Status}}</p1> 
         <h6>Autor:</h6> 
         <p1>{{selected_issue.Autor}}</p1> 
         <p1>{{id}}</p1> 
         <div> 
          <h6>Editar:</h6> 
          <select name='type' id='type'> 
          <option value="" disabled selected>Seleccionar</option> 
          <option value='OpCo' >Descripción</option> 
          <option value='Solucion' >Solución</option> 
          <option value='Estado' >Estado</option> 
          </select> 
          <div><button id"modalClose" type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button></div> 
         </div> 
        </div> 
       </div> 
      </div> 

    </div> 
       <script> 
    $("#type").on("change", function() {   
     $modal = $('#secondModal'); 
     if($(this).val() === 'OpCo'){ 
     $modal.modal('show'); 
     $('#type').val(''); 
    } 
}); 
    </script> 
    </div> 

正如代碼所示,觸發第二個模式是裏面的腳本第一個模式。每當你從下拉菜單中選擇一些,模式彈出,但我不知道如何傳遞像{{selected_issue.Descripcion}}這樣的變量,我也想知道如何傳遞$ index值來自陣列。

非常感謝大家。

+0

如果您使用的是angularjs,我會使用$ uibModal服務https://stackoverflow.com/questions/35350463/angular-uibmodal-resolve-unknown-provider – Praveen

+0

嘗試避免在角應用上使用jQuery。更好地使用像@Praveen所說的ui-bootstrap具有模式服務。 –

+0

很難理解如何使用這個uibModal服務......你能解釋一下我的案例進一步的應用嗎? @Praveen – Marcelo

回答

0

$ uibModal是一種創建模態窗口的服務。創建模態很簡單:創建模板和控制器,並在使用$ uibModal時引用它們。 $ uibModal服務只有一個方法:open(options)。

請參閱「開放式多模態一次」按鈕,在Plunker

欲瞭解更多信息請參閱this link

現在,在你的情況下,嘗試粘貼您的標記代碼,並使用決心對象,它是在開放的()或openComponentModal()。

+0

嘗試此鏈接https://plnkr.co/edit/gIGEJvRSMTu0NkejSE1c?p=preview – Praveen