Howto bind a Angular ui-select result to ui-grid/ng-grid

Question

i want to bind a ui-select result into a ui-grid...

$scope.gridOptions = {
      enableSorting: true,
      showFooter: true,
      columnDefs: [
        { field: 'name', name: 'Name' },
      ],
      data: 'multipleDemo.selected',
      onRegisterApi: function( gridApi ) {
        $scope.gridApi = gridApi;
      }  
    };


$scope.selectItem = function (item, model) {
  $scope.gridApi.core.notifyDataChange( $scope.gridApi.grid, uiGridConstants.dataChange.EDIT );
};

My Jade Template is like this:

ui-select(theme='bootstrap', multiple='', ng-model='multipleDemo.selected', ng-disabled='disabled', close-on-select='false', on-select='selectItem()')
        ui-select-match(placeholder='select something...') {{$item.name}}
        ui-select-choices(repeat='f in data | filter: $select.search')
          div(ng-bind-html='f.name | highlight: $select.search')

#grid.grid(ui-grid="gridOptions")

EDIT

i solved the problem. (my ng-controller was only around the gird, and not around the select...)

Answer 1

Would you mind posting a plunker or fiddle with your code? Hard to visual it and I'm working with something similar. Cheers!

EDIT: Behold StackOverflow'ers, an OP who answers his own question with a working solution. A truly rare and majestic beast to witness. From his comment: http://embed.plnkr.co/d37YrfRjE7YZPgwCncBE/preview