將angularjs數據傳遞到引導模式

首先，我對angularjs很新穎。所以當我試圖將數據從angularjs控制器傳遞到引導模式時，它們不會顯示。將angularjs數據傳遞到引導模式

觸發

<a ng-click="editarEndereco(item)" class="btn btn-primary btn-xs" data-toggle="modal" data-target="#exampleModalLong">Editar</a>

模態

<div class="modal fade" id="exampleModalLong" tabindex="-1" role="dialog" aria-labelledby="exampleModalLongTitle" aria-hidden="true"> 
    <div class="modal-dialog" role="document" > 
     <div class="modal-content" ng-controller="listaEnderecosController"> 
      <div class="modal-header"> 
       <h4 class="modal-title" id="exampleModalLongTitle">Alterar informações deste endereço</h4> 
       <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
        <span aria-hidden="true">&times;</span> 
       </button> 
      </div> 
      {{enderecoAlterar.bairro}} 
      <div class="modal-body" > 

      </div> 
      <div class="modal-footer"> 
       <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> 
       <button type="button" class="btn btn-primary">Save changes</button> 
      </div> 
     </div> 
    </div> 
</div>

AngularJS控制器

$scope.enderecoAlterar = {}; 

$scope.editarEndereco = function (item) { 
    $scope.enderecoAlterar = item; 
};

來源

2017-04-20 Felipe Bento

從這實現The ñ您將無法將參數傳遞給模態。

首先，您應該將內部內容的id="exampleModalLong" div分隔爲新的html文件。

然後編輯這個<a>標籤下面，

<a ng-click="editarEndereco(item)" class="btn btn-primary btn-xs">Editar</a>

而且你的控制器內，編輯如下editarEndereco功能，

$scope.editarEndereco = function (item) { 

    var modalInstance = $modal.open({ 
    controller: 'CREATE A NEW CONTROLLER FOR THE MODAL AS WELL. IF YOU ALREADY HAVE IT. MENTION IT HERE', 
    templateUrl: 'YOUR NEWLY CREATED HTML FILE URL HERE', 
    resolve: { 
     enderecoAlterar : item 
    } 
    }); 

};

然後modalinstance控制器內注入enderecoAlterar &使用它

來源

2017-04-20 04:03:32 DilumN

'$ modal'不可用。所以你要麼顯示OP如何顯示模式而不使用'angular-ui-boostrap'或者將OP重定向到'angular-ui-bootstrap'。 – Hoa

我正在使用angular.copy（item，$ scope.item）;功能。這是我如何在我的代碼做了：除非你用`角度-UI-bootstrap`

$scope.confirmDelete = function (item) { 
 
     $scope.item = {}; 
 
     angular.copy(item, $scope.item); 
 
     $('#delete-item-modal').modal({ 
 
      show: true 
 
     }); 
 
    }

<a role="button" ng-click="confirmDelete(offer)">Delete</a> 
 
    
 
    
 
    
 
<!-- Confirm delete modal --> 
 
<div class="modal fade" id="delete-item-modal" tabindex="-1" role="dialog"> 
 
    <div class="modal-dialog modal-sm"> 
 
    <div class="modal-content"> 
 
     <div class="modal-header"> 
 
     <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
 
     <h4 class="modal-title">Delete element</h4> 
 
     </div> 
 
     <div class="modal-body"> 
 
     <div class="row"> 
 
      <div class="col-xs-16"> 
 
      Are you sure you want to delete <strong>{{item.offerTitle}}</strong>? 
 
      </div> 
 
     </div> 
 
     </div> 
 
     <div class="modal-footer"> 
 
     <form novalidate name="deleteOfferForm" ng-submit="deleteOffer(item)"> 
 
      <input type="hidden" class="form-control" id="{{appData.securityTokenName}}" value="{{appData.securityToken}}"> 
 
      <button type="button" class="btn btn-xs btn-default" data-dismiss="modal">Cancel</button> 
 
       <button type="submit" class="btn btn-xs btn-danger">Delete</button> 
 
      </form> 
 
      
 
     </div> 
 
    </div><!-- /.modal-content --> 
 
    </div> 
 
</div>

來源

2017-04-20 04:36:32 gianni

這段代碼顯然不起作用......但你明白了。 – gianni

將angularjs數據傳遞到引導模式

回答

相關問題