bentorfs / angular-bootstrap-multiselect

Native angularJS custom form element
http://bentorfs.github.io/angular-bootstrap-multiselect/
MIT License
79 stars 111 forks source link

Objects as model and options does not work #14

Open alperentalaslioglu opened 8 years ago

alperentalaslioglu commented 8 years ago

I tried to input an object array

$scope.options = [ { id: '1', name: 'France', capital: 'Paris' }, { id: '2', name: 'United Kingdom', capital: 'London' }, { id: '3', name: 'Germany', capital: 'Berlin' } ];

to directive

I am taking an slice of undefined error

angular.min.js:114 TypeError: Cannot read property 'slice' of undefined at i (angular-bootstrap-multiselect.min.js:1) at g.$render (angular-bootstrap-multiselect.min.js:1) at angular.min.js:277 at m.$digest (angular.min.js:138) at m.$apply (angular.min.js:141) at g (angular.min.js:94) at t (angular.min.js:98) at XMLHttpRequest.u.onload (angular.min.js:99)

Is this related to my angular version? Or object as an input does not work regularly?

bentorfs commented 8 years ago

What does your html look like? Did you specify an id-prop ?

alperentalaslioglu commented 8 years ago

Hi @bentorfs

My directive :

I have also async problem.

My conroller data fill part is this:

XYZService.getTYP().then(function(response) { $scope.options = []; for(var i = 0; i < response.data.length; i++){ $scope.options.push({name: response.data[i].name,id: response.data[i].id}); } }

Because of asynchronous process, I am still taking same error.

I examined your demo link and for async you used options like this

$scope.fnOptions = function () { return $q(function (resolve, reject) { $timeout(function () { resolve([$scope.searchFilter + '1', $scope.searchFilter + '2']) }, 1000); });

I did not adapt my service to this code piece.

How can asyncly get data and put to my selectpicker ?

shradha03 commented 7 years ago

@alperentalaslioglu Did you find any solution.

@bentorfs I am facing the same issue...?

This is how I am using

<script type="text/javascript">
options: [
        {
        "id": "1",
        "name": "France",
        "capital": "Paris"
         },
         {
         "id": "2",
         "name": "United Kingdom",
          "capital": "London"
          },
          {
         "id": "3",
          "name": "Germany",
          "capital": "Berlin"
           }
    ]
 </script>

<multiselect  ng-model="selection" options="options"  id-prop="id" display-prop="name"></multiselect>

ERROR:

TypeError: Cannot read property 'slice' of undefined at i (angular-bootstrap-multiselect.min.js:1) at Object.g.$render (angular-bootstrap-multiselect.min.js:1)

Dylan-Israel commented 7 years ago

Did anyone find a solution for this?

DeepikaAzad commented 6 years ago

I have same issue...any solution?

Chengrongrong commented 6 years ago

After init setting the option = [], then set your data, is resolved.

Try it.