В определениях столбцов ui-grid, как добавить кнопку для загрузки изображения.функция angular.element (this) .scope (). не запускается в контроллере

Question

внутри определения столбца пользовательского интерфейса, мне нужно добавить кнопку для загрузки файла.

<input type="file" style="width:100px" name="file" id="file" ng-model="FileName" class="inputfile ng-pristine ng-untouched ng-valid ng-empty" ng-model-instant accept="image/*" ng-click="angular.element(this).scope().UploadBlogPicture(event)" >

Но функция UploadBlogPicture () не запускается в моем контроллере.

Я пытался grid.appScope.angular.element (это) .scope (). () функция, grid.appScope.angular.element (это) .appScope (). () функция, ng-click, ng-change. Но ничто не мешает моей функции

Я пробовал вот так

1

 { name: 'BlogFile', width: '25%', displayName: 'Blog File', cellClass: 'noPadding', cellTemplate: '<div class="ui-grid-cell-contents" ><input type="file" style="width:100px" name="file" id="file" ng-model="FileName" class="inputfile ng-pristine ng-untouched ng-valid ng-empty" ng-model-instant accept="image/*" ng-click="grid.appScope.angular.element(this).scope().UploadBlogPicture(event)" aria-invalid="false">', enableCellEdit: false },

2

   { name: 'BlogFile', width: '25%', displayName: 'Blog File', cellClass: 'noPadding', cellTemplate: '<input type="file" style="width:100px" name="file" id="file" ng-model="FileName" class="inputfile ng-pristine ng-untouched ng-valid ng-empty" ng-model-instant accept="image/*" ng-change="grid.appScope.angular.element(this).scope().UploadBlogPicture(event)" aria-invalid="false">', enableCellEdit: false },

Пожалуйста, помогите разобраться в проблеме

Answer 1

Если я правильно понял, вы используете для этого cellTemplate, верно?

Если вы используете «Controller as», вам нужно определить appScope в gridOptions, прежде чем использовать"grid.appScope.function ()":

vm.gridOptions = {
  appScope: vm
}

Или вы можете сделать "grid.appScope.vm.function ()" Но лучше использовать appScope в gridOptions.