I am facing a weird memory leak.
I am using uigrid appScopeProvider to be able to select a row in the grid and call an expression binding ("&") to validate my choice and close my component.
What I discovered this morning by using Chrome memory tools is that the parent of this component was never released and this component too. With the tool I've found the reason was the uigrid.
I tried to remove the use of this expression binding inside the appScopeProvider and my memory leak disappeared.
That is why I am convinced the issue is here.
Here is a sample code
angular.module('myApp')
.component('myComp', {
templateUrl: '....',
controller: [MyCompCtrl],
bindings: {
onValidate: '&'
}
}
function MyCompCtrl() {
var ctrl = this
ctrl.myData = []
ctrl.gridOptions = {
data: '$ctrl.myData',
appScopeProvider: {
onClick: function(row) {
ctrl.onValidate({ $row: row.entity })
}
},
rowTemplate: '<div ng-click="grid.appScope.onClick(row)" ng-repeat="(colRenderIndex, col) in colContainer.renderedColumns track by col.colDef.name\" class="ui-grid-cell" ui-grid-cell ></div>',
columnDefs: [...]
}
}
When my row is clicked, the onValidate binding is called, the parent of the component receive the data and the component is removed. I have a button too on this component which allow me to validate the current row without touching the grid. If I validate with the button I don't have any memory leak.
It seems that the issue is clearly when onClick is called on grid appScope.
I tried many things:
- use a declared function instead of a block
- listen for $scope $destroy event and remove appScopeProvider, nullify bindings expression, nullify appScopeProvider.onClick
- use events on rootScope inside onClick, and listen for event outside to call onValidate
- use eval() to call a function from string to prevent this grid from keeping a reference of my binding
- use what I've read here https://blog.meteor.com/an-interesting-kind-of-javascript-memory-leak-8b47d2e7f156 on this by nullifying lots of stuff in onClick and in $scope $destroy event
- call ctrl.gridApi.grid.appScope.$destroy
Nothing worked and I am out of ideas. I've already searched google and stackoverflow for something similar but didn't find anything
I guess I have to do something specific on $scope $destroy event to clean my uigrid to allow it to free my component but what?
Has any one already faced something similar?
from Memory leak with uigrid 3 appscope provider and angular 1.5 component expression bindings
No comments:
Post a Comment