I'm trying to set md-select's selected value, but I'm experiencing a problem.

When I open the page, I need to see the stock's pre-set category, but I can't see it. Instead, the same category is set for all of them. I also can't change the category when I select another one

I'm using Angular 1.5.5 & Angular Material 1.1.0

Thanks to @Pankaj Parkar, I got closer.

Codepen : http://codepen.io/anon/pen/WRayNP?editors=1010

HTML

<html lang="en"> <head> <title>Home</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- Angular Material style sheet --> <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/angular_material/1.1.0/angular-material.min.css"> <link rel="stylesheet" href="stylesheets/index.css"> <link rel="stylesheet" href="stylesheets/liste-app.css"> </head> <body ng-app="ListApp" ng-controller="ListAppController"> <div id="main"> <md-toolbar class="md-theme-light"> <h2 class="md-toolbar-tools"> <span>9 Feb 2017</span> </h2> </md-toolbar> <div layout="row" flex> <div flex="100" layout-padding> <div layout="row" flex> <md-toolbar class="md-theme-light green"> <h5 class="md-toolbar-tools"> <span class="align">Stocks & Categories</span> </h5> </md-toolbar> </div> <div layout="column" flex="50"> <md-list-item id="{{stock.stock}}" layout="row" ng-repeat="stock in stocks"> <div flex="20">{{stock.stock}}</div> <div flex="70"> <md-input-container> <label>Category</label> <md-select ng-model="stock.someOtherVal" style="min-width: 200px;" ng-model-options="{trackBy: '$value.id'}"> <md-option ng-repeat="category in categories" ng-value="category">{{category.value}} </md-option> </md-select> </md-input-container> </div> </md-list-item> </div> </div> </div> </div> <!-- Angular Material requires Angular.js Libraries --> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-animate.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-aria.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-messages.min.js"></script> <!-- Angular Material Library --> <script src="http://ajax.googleapis.com/ajax/libs/angular_material/1.1.0/angular-material.min.js"></script> <script src="javascripts/list-app.js"></script> <script> </script> </body> </html>

JavaScript