2016-03-01 48 views
2

我需要在ag-grid中的哪個位置,我需要打開一個菜單來添加/編輯/刪除該行數據。我使用角度材質菜單組件作爲單元格模板網址。但是當點擊該菜單項時,它不會觸發ag-grid中的onCellClicked事件以獲取對點擊的行數據的引用。但是,如果我從菜單項中單擊像素,則會觸發事件。 需要幫助弄清楚,我怎樣才能獲得菜單點擊行數據。如何通過ag網格中的角度材質菜單獲取行數據

我的AG-電網代碼放在這裏:

var columnDefs = [ 
    {headerName: "", field: "icon", width:65}, 
    {headerName: "Categories",field:"category_name", width:1025, cellRenderer:function(params){ 
    // my cell renderer code goes here 
     }, 
    onCellClicked:function(params){ 
     console.log("Cell is still getting click "+params.data); 
    //This click does not work 
    }, 

    {headerName: "", field: "options", width:87, suppressMenu: true, templateUrl:"partials/options.html" 
    } 
]; 

options.html

<md-menu> 
    <!-- <md-button aria-label="Open phone interactions menu" class="md-icon-button" ng-click="openMenu($mdOpenMenu, $event)"> 
    <md-icon md-svg-src="images/icons/options.svg" aria-label="android "></md-icon> 
    </md-button> --> 
    <a href="javascript:void(0)" class="option-btn" ng-click="openMenu($mdOpenMenu, $event)">options</a> 
    <md-menu-content width="4"> 
    <md-menu-item> 
     <md-button ng-click="modifyOptions($event)"> 
     <md-icon md-svg-src="images/icons/add.svg" aria-label="android "></md-icon> 
     Add 
     </md-button> 
    </md-menu-item> 
    <md-menu-item> 
     <md-button ng-click="toggleNotifications()"> 
     <md-icon md-svg-src="images/icons/edit.svg" aria-label="android "></md-icon> 
     Edit 
     </md-button> 
    </md-menu-item> 
    <md-menu-divider></md-menu-divider> 
    <md-menu-item> 
     <md-button disabled="disabled" ng-click="checkVoicemail()"> 
     <md-icon md-svg-src="images/icons/delete.svg" aria-label="android "></md-icon> 
     Delete 
     </md-button> 
    </md-menu-item> 
    </md-menu-content> 

回答

0

我發現我的問題的回答這是不是很辛苦,但:電池模板有可以通過調用data.your_property來訪問屬性。在這裏,我根本不需要onCellClicked事件。下面是工作代碼:

var columnDefs = [ 
    {headerName: "", field: "icon", width:65}, 
    {headerName: "Categories",field:"category_name", width:1025, cellRenderer:function(params){ 

     // Cell Renderer goes here 
}, 

    {headerName: "", field: "options", width:87, suppressMenu: true, templateUrl:"partials/options.html" 
    } 
]; 

option.html

<md-menu> 

    <a href="javascript:void(0)" class="option-btn" ng- click="openMenu($mdOpenMenu, $event, **data**)">options</a> 
<md-menu-content width="4"> 
<md-menu-item> 
    <md-button ng-click="modifyOptions($event, data)"> 
    <md-icon md-svg-src="images/icons/add.svg" aria-label="android "></md-icon> 
    Add 
    </md-button> 
</md-menu-item> 
<md-menu-item> 
    <md-button ng-click="modifyCategory(data)"> 
    <md-icon md-svg-src="images/icons/edit.svg" aria-label="android "></md-icon> 
    Edit 
    </md-button> 
</md-menu-item> 
<md-menu-divider></md-menu-divider> 
<md-menu-item> 
    <md-button disabled="disabled" ng-click="deleteCategory(data)"> 
    <md-icon md-svg-src="images/icons/delete.svg" aria-label="android "></md-icon> 
    Delete 
    </md-button> 
</md-menu-item> 

+0

我有同樣的問題,你能不能請您複製怎麼叫cellRenderer的被調用我真的將不勝感激 – Rudy