Angular: Empty Fiddle

http://angularjs.org/

by vorant

HTML

<script src="https://code.jquery.com/jquery-2.2.0.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.96.0/js/materialize.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.96.0/css/materialize.min.css">
<script src="https://code.angularjs.org/1.4.9/angular.js"></script>
<div ng-controller="MyCtrl">
  <select option-item>
    <option value="" disabled selected>Jump To Season</option>
    <option ng-repeat="item in users" value="{{item.id}}">
        {{item.name}}
    </option>
</select>
</div>

CSS

select._red {
  color: red;  
}

JavaScript

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

//myApp.directive('myDirective', function() {});
//myApp.factory('myService', function() {});

myApp.controller('MyCtrl', MyCtrl);

function MyCtrl($scope) {
    $scope.name = 'Superhero';
    $scope.users = [
    { id: 1, name: 'Bob' },
    { id: 2, name: 'Alice' },
    { id: 3, name: 'Steve' }
  ];
}

myApp.directive("optionItem", ['$timeout', function ($timeout) {
return {
    restrict: 'A',
    link: function (scope, element) {
      $timeout(function(){
        $('select').material_select();
      })
    }
};
}]);