Untitled

<!DOCTYPE html>
<html ng-app="plunker">

<head>
  <meta charset="utf-8" />
  <title>AngularJS Plunker</title>
  <script data-require="angular.js@1.3.15" data-semver="1.3.15" src="https://code.angularjs.org/1.3.15/angular.js"></script>
  <script>
    document.write('<base href="' + document.location + '" />');
  </script>
  <link rel="stylesheet" href="style.css" />
  <script src="script.js"></script>
</head>

<body ng-controller="MainCtrl">
  <p>selected item is : {{selectedItem}}</p>

  <p> name of selected item is : {{selectedItem.name}} </p>

  <select ng-model="selectedItem" ng-options="item.name for item in items track by item.id"></select>

</body>

</html>

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  
  $scope.items = [];
  $scope.selectedItem = { name: 'two', id: 27 };
  $scope.items = [{name: 'one', id: 30 },{ name: 'two', id: 27 },{ name: 'threex', id: 50 }];
  
});

/* Styles go here */