JSFiddle - React, Tailwind, and code Playground

HTML

<div ng-app='MyModule' ng-controller="MyController">
    <select ng-model="colour" ng-options="c.name as (c.name + ' ' + c.shade) for c in colors" ng-init="colour=2">
        <option value="">--Select Colour--</option
    </select>
    
    <p>You have selected colour: {{colour}}</p>
</div>

JavaScript

angular.module('MyModule', [])

.controller('MyController', function( $scope ) {
    
    $scope.colors = [
        {id: 1, name: 'black', shade: 'dark'},
        {id: 2, name: 'white', shade: 'light'},
        {id: 3, name: 'red', shade: 'dark'},
        {id: 4, name: 'blue', shade: 'dark'},
        {id: 5, name: 'yellow', shade: 'light'}
    ];
});