Angular: Empty Fiddle

http://angularjs.org/

HTML

<div ng-controller="MyCtrl">
    <p>   "Real" use case (<i>goal</i>) is to handle grouping, like below, pre-select the null value and not have an empty element ever appear.</p>
<p>    Howto: Select any value, then the --- value! Why is a new null element added and how do I remove it?
</p>    
    <div>Preferred version: <select ng-model='form.groupType' required ng-options='option.value as option.name group by option.group for option in groupTypeOptions'></select></div>
    <b>Selected: {{form.groupType}}</b>
    
    <br /><br />
    <p>Simple version, similair behaviour despite multiple attempts</p>
    
    <div>Preferred version: <select ng-model='form.type' required ng-options='option.value as option.name for option in typeOptions track by option.value'></select></div>
    <div>Backup idea #1: <select ng-model='form.type' required ng-options='option.name for option in typeOptions track by option.value'></select></div>
    <div>Backup idea #2: <select ng-model='form.type' required ng-options='option.value as option.name for option in typeOptions'></select></div>
    <b>Selected: {{form.type}}</b>
        
</div>

JavaScript

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


function MyCtrl($scope) {
    
    $scope.typeOptions = [
    { name: '---', value: null }, 
    { name: 'Feature', value: 'feature' }, 
    { name: 'Bug', value: 'bug' }, 
    { name: 'Enhancement', value: 'enhancement' }
    ];

    $scope.groupTypeOptions = [
        { group: 'g1', name: '---', value: null }, 
    { group: 'g2', name: 'Feature', value: 'feature' }, 
    { group: 'g2', name: 'Bug', value: 'bug' }, 
    { group: 'g2', name: 'Enhancement', value: 'enhancement' }
    ];
    $scope.form = {
        type : $scope.typeOptions[0].value,
        groupType : $scope.groupTypeOptions[0].value
    };
    
    
}