CODEWITHSUNDEEP
angularjs
MrNew
MrNew

Reputation: 1414

ng-option filter reservse select first value

HI trying to select the first option using filter/orderBy: however its not working, i know that | is a filter function in angular. Its selecting the last value/label at the moment, how can I select the first label (Days) instead?

I tried orderBy: -npu.label and the code below but no luck.

vm.NoticePeriodUnitValue = [{
        value: 1,
        label: 'Days'
    }, {
        value: 7,
        label: 'Weeks'
    }, {
        value: 30,
        label: 'Months'
    }, {
        value: 365,
        label: 'Years'
    }];

<select name="NoticePeriodOptions" data-ng-change="vm.setNoticePeriod()" data-ng-model="vm.NoticePeriodUnit" 
            class="form-control search-input inverted mt-10" id="profile_notice-period-unit" 
            data-ng-options="npu.value as npu.label for npu in vm.NoticePeriodUnitValue | filter: -npu.label"> 
        </select>

Upvotes: 2

Views: 116

Answers (3)

Alexan Gulbudaghyan
Alexan Gulbudaghyan

Reputation: 1

Controller: 

    vm.NoticePeriodUnitValue = [{
            value: 1,
            label: 'Days'
        }, {
            value: 7,
            label: 'Weeks'
        }, {
            value: 30,
            label: 'Months'
        }, {
            value: 365,
            label: 'Years'
        }];
    vm.NoticePeriodUnit = {value: 1, label: 'Days'};
vm.setNoticePeriod = function() {
  console.log(vm.NoticePeriodUnit);
}

    HTML:
    <select name="NoticePeriodOptions" data-ng-change="vm.setNoticePeriod()" data-ng-model="vm.NoticePeriodUnit.value" 
                class="form-control search-input inverted mt-10" id="profile_notice-period-unit" 
                data-ng-options="npu.value as npu.label for npu in vm.NoticePeriodUnitValue"> 
            </select>

Upvotes: 0

moks
moks

Reputation: 99

You can set default value for the model and remove that filer. 

$scope.vm = {
                NoticePeriodUnitValue: [{
                    value: 1,
                    label: 'Days'
                }, {
                    value: 7,
                    label: 'Weeks'
                }, {
                    value: 30,
                    label: 'Months'
                }, {
                    value: 365,
                    label: 'Years'
                }], 
               NoticePeriodUnit: 1
            }

Upvotes: 1

z.a.
z.a.

Reputation: 2777

add this to you code,

vm.NoticePeriodUnit = vm.NoticePeriodUnitValue[0].value;

that will give you a default value to start with

Upvotes: 1

Related Questions