angularjs - Reset Angular dropdown option in Ionic - won't reset after value is changed from initial value -

i'm trying figure out why can't seem wrangle simple angular dropdown reset.

when view loads, hit button "reset", , changes whatever value selected different one, based on functionality in controller dictates. works fine on page load, if change value in dropdown click "reset", nothing. doesn't reset dropdown specified in function , can't figure out.

steps reproduce:

1. page loads
2. click "reset" button
3. dropdown value changes "japanese"
4. change value "english"
5. click "reset" button
6. nothing. should change value english, doesn't.

i've boiled down basic example using extremely basic ionic example in codepen:

http://codepen.io/starshock/pen/epdxpz

basically, here controller code:

.controller('dropdowncontroller', [ '$scope', '$state', function($scope, $state) {         $scope.navtitle = 'dropdown reset';          $scope.reset = function() {           $scope.selectedoption = $scope.languages[0];         }          $scope.languages = [           { name: "english"},           { name: "japanese"}         ];       $scope.selectedoption = $scope.languages[1];     }]); 

and here template:

<script id="entry.html" type="text/ng-template">     <ion-nav-bar animation="nav-title-slide-ios7"                  type="bar-positive"                  back-button-type="button-icon"                  back-button-icon="ion-ios7-arrow-back">     </ion-nav-bar>      <ion-view title="{{navtitle}}" class="bubble-background">          <ion-content has-header="true" padding="true">              <div class="item item-input item-select" href="#">       <label>         <div class="input-label">           select language         </div>         <select           data-ng-options="language.name language in languages"           data-ng-model="selectedoption">         </select>       </label>     </div>             <button class="button button-positive" ng-click="reset()">reset</button>          </ion-content>     </ion-view> </script> 

i've been struggling problem months , have number of instances utilize similar code. angular masters have thoughts? :d

you need change controller reference same object each time (see https://stackoverflow.com/a/17607794/360067 , answer referenced i.e. https://stackoverflow.com/a/14049482/360067 basics).

assuming default value want english (if it's japanese, change index 1 in both places)

    $scope.reset = function() {       $scope.filter.selectedoption = $scope.languages[0];     }      ...      $scope.filter = {       selectedoption: $scope.languages[0]     }; 

and in html

    <select       data-ng-options="language.name language in languages"       data-ng-model="filter.selectedoption">     </select> 

---

codepen - http://codepen.io/anon/pen/kvgqog