JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.2/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-material/1.1.24/angular-material.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/angular-material/1.1.24/angular-material.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-animate/1.7.2/angular-animate.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-aria/1.7.2/angular-aria.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-messages/1.7.2/angular-messages.min.js"></script>
<div ng-controller="AppController">
	<md-select ng-model="params.noMultiple" aria-label="">
		<md-option ng-repeat="item in list" ng-value="item.code">{{item.name}}</md-option>
	</md-select>
	<md-select ng-model="params.multiple" aria-label="" multiple>
		<md-option ng-repeat="item in list" ng-value="item.code">{{item.name}}</md-option>
	</md-select>
	<button type="button" ng-click="change()">Change</button>
	<pre>{{params | json}}</pre>
</div>

JavaScript

( function() {
angular.module( 'ngMaterial' )
	.directive( 'mdSelect', mdSelect );

function mdSelect( $timeout ) {
	return {
		restrict: 'E',
		compile: compile
	};

	function compile( tElement, tAttrs ) {
		var isMultiple = angular.isDefined( tAttrs.multiple ),
			selectedProp = tAttrs.ngModel,
			elem = tElement.find( 'md-option' ),
			listProp = elem.attr( 'ng-repeat' ).split( 'in' )[ 1 ],
			idProp = elem.attr( 'ng-value' ).split( '.' )[ 1 ];
		return function( scope ) {
			scope.$watch( listProp, function( array ) {
				var obj = {};
				angular.forEach( array, function( item ) {
					obj[ item[ idProp ] ] = true;
				} );
				var selectedValue = scope.$eval( selectedProp ),
					finalSelectedValue;
				if ( isMultiple ) {
					finalSelectedValue = [];
					angular.forEach( selectedValue, function( value ) {
						if ( value in obj )
							finalSelectedValue.push( value );
					} );
					$timeout( function() {
						scope.$$finalSelectedValue = finalSelectedValue;
						scope.$eval( selectedProp + '=$$finalSelectedValue' );
						delete scope.$$finalSelectedValue;
					} );
				} else if ( !( selectedValue in obj ) )
					scope.$eval( selectedProp + '=undefined' );
			} );
		};
	}
}

angular.module( 'app', [ 'ngMaterial' ] )
	.controller( 'AppController', AppController );

function AppController( $scope ) {
	$scope.params = {
		noMultiple: undefined,
		multiple: []
	};
	$scope.list = [];

	var lists = [
			[
				{ code: 1, name: 'One' },
				{ code: 2, name: 'Two (1)' },
				{ code: 3, name: 'Three (1)' }
			],
			[
				{ code: 2, name: 'Two (2)' },
				{ code: 3, name: 'Three (2)' },
				{ code: 4, name: 'Four' }
			]
		],
		n = 1;

	activate();
	
	function activate() {
		change();
	}

	$scope.change = change;

	function change() {
		n = n ? 0 : 1;
		$scope.list = lists[ n ];
	}
}
} )();