americanslon americanslon - 6 months ago 315
AngularJS Question

md-select can't set selected value

I have a

md-select
set up as follows:

<md-select placeholder="Category" ng-model="current.Category" flex >
<md-option ng-repeat="item in categories" ng-value="{{item}}">{{item.Name}}</md-option>
</md-select>


@scope.categories
value is

[
{
"Name":"Commercial & Industrial",
"ParentId":null,
"Categories":[
{
"Name":"Deceptive Marketing",
"ParentId":19,
"Categories":[

],
"Id":24,
"ModifiedDate":"2015-08-06T07:49:53.0489545",
"CreatedDate":"2015-08-06T15:49:51.707"
},
{
"Name":"Aggressive Agents",
"ParentId":19,
"Categories":[

],
"Id":25,
"ModifiedDate":"2015-08-06T07:50:10.0026497",
"CreatedDate":"2015-08-06T15:50:08.63"
}
],
"Id":19,
"ModifiedDate":"08/06/2015 @ 7:49AM",
"CreatedDate":"08/06/2015 @ 3:49PM"
},
{
"Name":"Competitive Supply",
"ParentId":null,
"Categories":[
{
"Name":"Security Deposit",
"ParentId":20,
"Categories":[

],
"Id":21,
"ModifiedDate":"2015-08-06T07:49:30.3966895",
"CreatedDate":"2015-08-06T15:49:25.8"
},
{
"Name":"Meter",
"ParentId":20,
"Categories":[

],
"Id":22,
"ModifiedDate":"2015-08-06T07:49:34.6571155",
"CreatedDate":"2015-08-06T15:49:33.3"
},
{
"Name":"Bill",
"ParentId":20,
"Categories":[

],
"Id":23,
"ModifiedDate":"2015-08-06T07:49:41.7268224",
"CreatedDate":"2015-08-06T15:49:40.357"
}
],
"Id":20,
"ModifiedDate":"08/06/2015 @ 7:49AM",
"CreatedDate":"08/06/2015 @ 3:49PM"
}
]


The
md-select
works fine. But what I can't figure out is how to set select value. When I try setting the model
current.Category
to one of the values from the
$scope.categories
it doesn't get set.

Answer

The documentation isn't explicit, but you should use ng-selected. I've created a codepen to illustrate, but basically:

<md-option ng-repeat="(index,item) in categories" ng-value="{{item}}"
           ng-selected="index == 1">    
    {{item.Name}}
</md-option>

This'll select the the second category (index 1 in your category array).

Comments