Untitled

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

  <head>
    <script data-require="angular.js@1.3.13" data-semver="1.3.13" src="https://code.angularjs.org/1.3.13/angular.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body ng-controller="TestController">
    <select type="text" class="form-control form-control-small" ng-model="itemId" ng-options="item.id as item.name for item in items" ng-click="reset()" ng-change="update()" >
      <option value=""></option>
    </select>
  
  {{itemId}}
  </body>

</html>

// Code goes here

angular.module('testApp', []).controller('TestController', ['$scope',
    function($scope) {

      $scope.itemId = 0;
      $scope.changed = false;
      
      $scope.items = [{
        "id": 1,
        "name": "AAA"
      }, {
        "id": 2,
        "name": "BBB"
      }, {
        "id": 3,
        "name": "CCC"
      }, {
        "id": 4,
        "name": "DDD"
      }]

      $scope.update = function() {
        $scope.changed = true;
      }
      
      $scope.reset = function() {
        if($scope.itemId > 0 && !$scope.changed) {
          $scope.itemId = 0;
        }
        $scope.changed = false;
      }
    }]);

/* Styles go here */