¿Dónde puedo obtener artículos de UI-Grid angular seleccionados? -- javascript campo con angularjs campo con angular-ui-grid camp Relacionados El problema

Where can I get Angular ui-grid selected items


37
vote

problema

Español

probando la red de ui angular (NG-Grid v.3.0). No puede para la vida de mí encontrar la fila seleccionada. Solo quiero tomar las filas o incluso la fila de fila cuando un usuario lo haga hacer clic. Encontré el comentario superior aquí, pero creo que esto está desactualizado: ¿Recibiendo filas seleccionadas de NG-Grid?

¿Alguien sabe dónde se almacena el gridOptions.selectedItems en 3.0?

Original en ingles

Testing out Angular ui-grid (ng-grid v.3.0). Can not for the life of me find the selected row. I just want to grab the rows or even row ID of row when a user clicks it. Found the top comment here but I think this is outdated: Getting select rows from ng-grid?

Does anyone know where the gridOptions.selectedItems is being stored in 3.0?

        

Lista de respuestas

36
 
vote
vote
La mejor respuesta
 

¿Es esto lo que estás buscando? http://ui-grid.info/docs/#/tutorial/210_selection

  1. Active las capacidades de selección de cuadrícula con la etiqueta de selección de interfaz de usuario (y el registro de módulos de selección de ui.grid.selection en su aplicación
  2. Registre Gridapi y use gridapi.selection para acceder a GetSelectedRows ()
 

Is this what your are looking for ? http://ui-grid.info/docs/#/tutorial/210_selection

  1. Activate grid selection capabilities with the ui-grid-selection tag (and ui.grid.selection module registration in your app
  2. register gridApi and use gridApi.selection to access getSelectedRows()
 
 
24
 
vote

Además de los pasos por encima de https://stackoverflow.com/a/26188783/2658127 , usted podría tener Para invocarlo a través de un evento NG-click para obtener el valor / objeto real. Al menos así fue como lo tenía trabajando.

  Eg: $scope.selectRow = function(){     $scope.gridApi.selection.getSelectedRows(); };   

y llame selectrow () de la plantilla.

Esto es para cualquiera que haya sido confundido como lo hice, teniendo en cuenta el hecho de que la interfaz de usuario no tiene la mejor documentación (especialmente para esta parte seleccionada).

 

In addition to the steps above https://stackoverflow.com/a/26188783/2658127, you might have to invoke it through a ng-click event to get the actual value/object. At least that's how I had it working.

Eg: $scope.selectRow = function(){     $scope.gridApi.selection.getSelectedRows(); }; 

And call selectRow() from the template.

This is for anybody who have been confused like I did, considering the fact that ui-grid does not have the best documentation (specially for this select portion).

 
 
 
 
16
 
vote

El enfoque más fácil es:

  1. Registre el Gridapi agregando este su controlador:

    $scope.gridOptions.onRegisterApi = function(gridApi) { $scope.myGridApi = gridApi; };

  2. Acceda a la matriz de artículos seleccionados:

    $scope.myGridApi.selection.getSelectedRows();

 

The easiest approach is:

  1. Register the gridApi by adding this your controller:

    $scope.gridOptions.onRegisterApi = function(gridApi) { $scope.myGridApi = gridApi; };

  2. Access the array of selected items:

    $scope.myGridApi.selection.getSelectedRows();

 
 
0
 
vote

Con la interfaz de usuario, debe usar el selection.on.rowSelectionChanged para actualizar una variable de alcance que almacena el seleccionado. De esta manera, puede usar el valor en una expresión de enlace.

  var SelectController = function($scope) {     ...     $scope.selectedItem = null;      $scope.gridOptions = {             data : 'articles',             enableRowSelection : true,             multiSelect : false,             enableRowHeaderSelection : false,             ...         };          $scope.gridOptions.onRegisterApi = function(gridApi) {             // set gridApi on scope             this.$scope.gridApi = gridApi;         }.bind(this);         $scope.gridOptions.onRegisterApi = function(gridApi) {             // set gridApi on scope             this.$scope.gridApi = gridApi;             this.$scope.gridApi.selection.on.rowSelectionChanged($scope,                     function(row) {                         this.$scope.selectedItem = row.entity;                     }.bind(this));         }.bind(this);   

Use una matriz en lugar de un objeto liso si necesita múltiples selección.

 

With grid ui you have to use the selection.on.rowSelectionChanged to update a scope variable that store the selectedItem. In this way you can use the value in a binding expression.

var SelectController = function($scope) {     ...     $scope.selectedItem = null;      $scope.gridOptions = {             data : 'articles',             enableRowSelection : true,             multiSelect : false,             enableRowHeaderSelection : false,             ...         };          $scope.gridOptions.onRegisterApi = function(gridApi) {             // set gridApi on scope             this.$scope.gridApi = gridApi;         }.bind(this);         $scope.gridOptions.onRegisterApi = function(gridApi) {             // set gridApi on scope             this.$scope.gridApi = gridApi;             this.$scope.gridApi.selection.on.rowSelectionChanged($scope,                     function(row) {                         this.$scope.selectedItem = row.entity;                     }.bind(this));         }.bind(this); 

Use a an array instead of a plain object if you need multiple selection.

 
 

Relacionados problema

0  Agregar y mostrar validación en angularjs ui.grid para ui.grid.edit en una celda  ( Adding and showing validation in angularjs ui grid for ui grid edit on a cell ) 
Tengo una aplicación AngularJS utilizando ui.grid. Quiero habilitar y mostrar errores de validación al editar una celda. Creo que esto se puede implementar a ...

18  CAMBIAR LA VISIBILIDAD DE LAS COLUMNAS DE UI-INCLUY  ( Change angular ui grids columns visibility ) 
Quiero mostrar / ocultar columnas después de que se prestara la cuadrícula. Antes de moverme a la nueva Grid UI. Llamé a toggleVisible() pero ahora no parec...

0  Revestimiento de la red de la UI angular no recibida  ( Angular ui grid callbacks not received ) 
Estoy tratando de obtener una devolución de llamada de la red de interfaz de usuario angular (después de que los datos están cargados / representados), pero n...

2  Mostrar valor booleano personalizado en interfaz de usuario angular  ( Display custom boolean value in angular ui grid ) 
OK, soy nuevo en la cuadrícula de ui angular y angular. Estoy usando angularjs (v1.4) con angular-ui-shird (v3.0.7). He definido una cuadrícula como la sigu...

0  No se puede acceder a UI-Grid en CellTemplate  ( Cant access ui grid in celltemplate ) 
Estoy tratando de crear una columna con diferentes formatos dentro de mi interfaz de usuario dentro del marco angular. columnDefs: [{ n...

2  Resuelva la longitud de la matriz en la cuadrícula de ui angular y habilitar / deshabilitar dinámicamente la paginación  ( Resolve array length in angular ui grid and dynamically enable disable paging ) 
Estoy recibiendo una colección anidada del servicio. Cuando estoy mapeando el campo para matar con Array. Longitud, me está dando salida. Pero cuando lo inten...

1  Quiero escribir una directiva personalizada para ui-shird con diferentes comentarios de entrada  ( I want to write a custom directive for ui grid with different input columndefs ) 
Este es mi controlador $scope.usersList = {}; $scope.usersList = { paginationPageSizes: [10,15, 20], paginationPageSize: 10, columnDefs: [ ...

0  Cambio de la propiedad de plantillas de celdas en cuadrícula de ui angular  ( Changing cell template property in angular ui grid ) 
Estoy trabajando en Angular UI grid y estoy tratando de cambiar la propiedad de la plantilla de celda en el botón, pero no afecta al UI grid . Aquí está ...

1  El error 'uigrid' debe tener exactamente un elemento raíz. ui-shird / ui-shird cuando se inicia la rejilla de usuario  ( Error uigrid must have exactly one root element ui grid ui grid when ui grid ) 
Mientras intentas agregar ui-shird a un proyecto angular, encontré este problema. He arruinado el ángel; APLICACIÓN AR con la dependencia de la red UI inyec...

0  Clasificación de fecha de la red ui  ( Ui grid date sorting ) 
Cuando se clasifica, la fecha se ordena de acuerdo con la cadena, es decir, a través de solo los primeros 2 caracteres. CAN u por favor, envíe un código para ...




© 2022 respuesta.top Reservados todos los derechos. Centro de preguntas y respuestas reservados todos los derechos