title: angularjs select box set object value
body: <p>this is my angular </p>
  
  <pre><code>angular.module("myApp",[])
  .controller("myCtrl",function($scope){
    $scope.projectObj = {"proId":"33","proName":"samal"}
    $scope.projectArr = [{"proName":"samal","proId":"33"},{"proName":"aaa","proId":"47"},{"proName":"sdf","proId":"48"},{"proName":"sdf","proId":"49"},{"proName":"sddd","proId":"50"},{"proName":"dddd","proId":"51"},{"proName":"ttt","proId":"52"},{"proName":"sdf","proId":"53"},{"proName":"sdf","proId":"54"},{"proName":"sdf","proId":"55"},{"proName":"sdf","proId":"56"},{"proName":"sdf","proId":"57"},{"proName":"sdf","proId":"58"},{"proName":"sdf","proId":"59"},{"proName":"sdf","proId":"60"}]
  })
  </code></pre>
  
  <p>this is my select box </p>
  
  <pre><code>&lt;select ng-model="projectObj"&gt;
     &lt;option value="{{item}}" ng-repeat="item in projectArr"&gt;{{item.proName}}&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p><strong>$scope.projectObj</strong> is already assign with an object and it is already inside  <strong>$scope.projectArr</strong>. what is want is when i load the html file $scope.projectObj <code>proName</code> should be pre-selected.how can i do this. this is my <a href="https://plnkr.co/edit/Fk2JLEoGtRJhegplYC6L?p=preview" rel="nofollow">pluker</a></p>