How to use a simple array of options

[debonair]

Consider this

1.$scope.options = ['option1', 'option2']; 2.$scope.options [{label: 'option1', value:'option1'},{label: 'option1', value:'option1'}];

How do I make this work with option 1?

indrimuska commented 9 years ago

Hi @debonair,

You have two ways to do that:

1. Change your templates

If the object in your array has not a "standard" form (I mean, a label and a value attribute) you could define a custom template for the dropdown and selected items.

<script type="text/ng-template" id="simple-array.html">
    {{option}}
</script>

<select selector
        model="ctrl.mySelect"
        options="ctrl.myOptions"
        view-item-template="'simple-array.html'"
        dropdown-item-template="'simple-array.html'"></select>

Check out this plunker.

2. Parse your array

You could also create a shadow copy of your array to pass to the angular-selector directive.

$scope.options = [ 'option1', 'option2', 'option3' ];

$scope.$watch('options', function () {
    $scope.myOptions = ($scope.options || []).map(function (option) {
        return { value: option, label: option };
    });
});

This is a plunker for this second scenario.

Let me know if one of these fits your needs.

debonair commented 9 years ago

Thanks for the prompt response, these solutions work perfectly

indrimuska commented 9 years ago

Glad to hear it! :+1:

kmturley commented 8 years ago

I had the same issue, it seems like it would be really easy to support arrays as dropdown options. Two lines of code change... just add '|| option' to the ng-bind template:

angular-selector.js lines 475 + 476

$templateCache.put('selector/item-default.html', '<span ng-bind="option[labelAttr] || option"></span>');
$templateCache.put('selector/group-default.html', '<span ng-bind="option[groupAttr] || option"></span>');

I've created a branch here away from my other commits: https://github.com/kmturley/angular-selector/commit/b8480cdb89b4661095e7d1f5d8cebe791f70a194

indrimuska commented 8 years ago

@kmturley that's a great idea! If you would like to open a PR, I will absolutely merge that into master branch. :+1:

kmturley commented 8 years ago

@indrimuska I created it in a branch because it seems I can't have two pull requests open at the same time. Are you able to merge from this commit? https://github.com/kmturley/angular-selector/commit/b8480cdb89b4661095e7d1f5d8cebe791f70a194

indrimuska commented 8 years ago

Yes, you can't have 2 or more open PRs on a branch in the same time. Unfortunately, I can't merge that commit because of the previous ones relating your other PR (if I merge that commit I have to merge all the previous ones).

Nevermind, I'll just add that feature. Next time, start a new branch from my master branch. Thanks for looking into this man!

indrimuska commented 8 years ago

I just pushed this out as 0.7.1. Thanks :)

• © Githubissues.
• Githubissues is a development platform for aggregating issues.

[indrimuska]

Hi @debonair,

You have two ways to do that:

1. Change your templates

If the object in your array has not a "standard" form (I mean, a label and a value attribute) you could define a custom template for the dropdown and selected items.

<script type="text/ng-template" id="simple-array.html">
    {{option}}
</script>

<select selector
        model="ctrl.mySelect"
        options="ctrl.myOptions"
        view-item-template="'simple-array.html'"
        dropdown-item-template="'simple-array.html'"></select>

Check out this plunker.

2. Parse your array

You could also create a shadow copy of your array to pass to the angular-selector directive.

$scope.options = [ 'option1', 'option2', 'option3' ];

$scope.$watch('options', function () {
    $scope.myOptions = ($scope.options || []).map(function (option) {
        return { value: option, label: option };
    });
});

This is a plunker for this second scenario.

Let me know if one of these fits your needs.

[debonair]

Thanks for the prompt response, these solutions work perfectly

[indrimuska]

Glad to hear it! :+1:

[kmturley]

I had the same issue, it seems like it would be really easy to support arrays as dropdown options. Two lines of code change... just add '|| option' to the ng-bind template:

angular-selector.js lines 475 + 476

$templateCache.put('selector/item-default.html', '<span ng-bind="option[labelAttr] || option"></span>');
$templateCache.put('selector/group-default.html', '<span ng-bind="option[groupAttr] || option"></span>');

I've created a branch here away from my other commits: https://github.com/kmturley/angular-selector/commit/b8480cdb89b4661095e7d1f5d8cebe791f70a194

[indrimuska]

@kmturley that's a great idea! If you would like to open a PR, I will absolutely merge that into master branch. :+1:

[kmturley]

@indrimuska I created it in a branch because it seems I can't have two pull requests open at the same time. Are you able to merge from this commit? https://github.com/kmturley/angular-selector/commit/b8480cdb89b4661095e7d1f5d8cebe791f70a194

[indrimuska]

Yes, you can't have 2 or more open PRs on a branch in the same time. Unfortunately, I can't merge that commit because of the previous ones relating your other PR (if I merge that commit I have to merge all the previous ones).

Nevermind, I'll just add that feature. Next time, start a new branch from my master branch. Thanks for looking into this man!

[indrimuska]

I just pushed this out as 0.7.1. Thanks :)