JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.5/angular.js"></script>
<div ng-app="optionsTest" ng-controller="MainController">
  select name:
  <select ng-model="selectedName" ng-change="resetSkills()" ng-options="name as name.name for name in names">
    <option value="" ng-if="!selectedName">--Select a name --</option>
  </select>

  <select ng-model="selectedSkill" ng-options="skill as skill.skillName for skill in skills">
    <option value="" ng-if="!selectedSkill">--Select a skill --</option>
  </select>
  <br>
  selectedName: {{selectedName}}
  <br>
  selectedSkill: {{selectedSkill}}
</div>

JavaScript

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

app.controller('MainController', function($scope) {

  $scope.resetSkills = function() {
    debugger;
    $scope.selectedSkill = undefined;
  }
  $scope.names = [{
    name: 'John',
    id: 1
  }, {
    name: 'Joe',
    id: 2
  }, {
    name: 'Jill',
    id: 3
  }];

  $scope.skills = [{
    skillName: 'skill1',
    id: 1
  }, {
    skillName: 'skill2',
    id: 2
  }, {
    skillName: 'skill3',
    id: 3
  }]
})