引导模态上点击UI电网

Question

链接在我的UI电网这里是列在DEFS我myController.js文件：

{ field: 'trans_typ_dsc', headerTooltip: 'Transaction Type Description', displayName: 'Transaction Type Description', cellTemplate: '<div class="wordwrap">{{COL_FIELD}}</div>' }, 
    { field: 'trans_stat', displayName: 'Transaction Status' }, 
    { field: 'sub_trans_actn_typ', displayName: 'Sub Transaction Action Type', cellTemplate: '<div class="wordwrap">{{COL_FIELD}}</div>' , visible : false }, 
    { field: 'case_key', displayName: 'Case Key', visible: true, celltemplate: '<a class="text-center" ng-href="#" ng-click="grid.appScope.setAssociateCaseModal(row)">{{COL_FIELD}}</a>' }, 
    { field: 'approved_by', displayName: 'Approved By', visible: false } 

这里就点击case_key链接UI引导模式弹出。

如何做到这一点？

我知道在使用按钮一个HTML文件，点击它是一样的东西：

  <h3>Search Transaction</h3> 
      <div style="float: right; margin-top: -35px"><button type="button" class="btn btn-default" data-toggle="modal" data-target="#recentSearchesModal">Recent Searches</button></div> 
     </div> 

     <div class="modal fade" id="recentSearchesModal" role="dialog"> 
      <div class="modal-dialog"> 

       <div class="modal-content"> 
        <div class="modal-header"> 
         <button type="button" class="close" data-dismiss="modal">&times;</button> 
         <h4 class="modal-title">Recent Searches</h4> 
        </div> 
        <div class="modal-body"> 

         <div class="panel panel-default"> 

          <div class="menu_simple" ng-repeat="obj in CaseRecentSearches" style="padding:8px;"> 
           <ul> 
            <li> 
             <a href="#" ng-click="TransactionRecentSearch(obj)" ng-model="obj"> {{obj | placeholderfunc}} </a> 
            </li> 
           </ul> 
          </div> 
          <!-- /.panel-body --> 
         </div> 
        </div> 

        <div class="modal-footer"> 
         <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
        </div> 
       </div> 

      </div> 
     </div> 

但这里的单击事件，然后我controller.js文件如何获得模态开的呢？

Answer 1

您需要修改该字段的cellTemplate，然后致电grid.appScope.openModal()。 openModal应该在$scope.openModal的主控制器中。像这样做：

您的模板：

var myTemplate = "<a href='#' ng-click='grid.appScope.openModal($event, row)'>{{ row.entity.myFieldName }}</a>"; 

使用模板gridOptions。

$scope.gridOptions = { 
    columnDefs: [{ 
     field: 'myFieldName', 
     displayName: 'My Field Name', 
     cellTemplate: myTemplate; 
    }] 
}; 

函数调用模式：

$scope.openModal = function (e, row) { 
    //in here, you can access the event object and row object 
    var myEvent = e; 
    var myRow = row; 

    //this is how you open a modal 
    var modalInstance = $uibModal.open({ 
     templateUrl: '/path/to/modalTemplate.html', 
     controller: MyModalCtrl, 
     backdrop: 'static' 
     //disable the keyboard 
     //keyboard: false, 
     resolve { 
      //pass variables to the MyModalCtrl here 
      event: function() { return myEvent; }, 
      row: function() { return myRow; } 
     } 
    }); 

    //call the modal to open, then decide what to do with the promise 
    modalInstance.result.then(function() { 
     //blah blah the user clicked okay 
    },function(){ 
     //blah blah the user clicked cancel 
    }) 
}