Eliminar la opción en blanco de la opción Seleccionar con AngularJS

Solución:

Como referencia: ¿Por qué angularjs incluye una opción vacía en select?

El vacío option se genera cuando un valor referenciado por ng-model no existe en un conjunto de opciones pasadas a ng-options. Esto sucede para evitar la selección accidental del modelo: AngularJS puede ver que el modelo inicial no está definido o no está en el conjunto de opciones y no quiere decidir el valor del modelo por sí solo.

En resumen: la opción vacía significa que no se selecciona ningún modelo válido (por válido quiero decir: del conjunto de opciones). Debe seleccionar un valor de modelo válido para deshacerse de esta opción vacía.

Cambia tu código así

var MyApp=angular.module('MyApp1',[])
MyApp.controller('MyController', function($scope) {
  $scope.feed = {};

  //Configuration
  $scope.feed.configs = [
    {'name': 'Config 1',
     'value': 'config1'},
    {'name': 'Config 2',
     'value': 'config2'},
    {'name': 'Config 3',
     'value': 'config3'}
  ];
  //Setting first option as selected in configuration select
  $scope.feed.config = $scope.feed.configs[0].value;
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div ng-app="MyApp1">
  <div ng-controller="MyController">
    <input type="text" ng-model="feed.name" placeholder="Name" />
    <!-- <select ng-model="feed.config">
<option ng-repeat="template in configs">{{template.name}}</option>
</select> -->
    <select ng-model="feed.config" ng-options="template.value as template.name for template in feed.configs">
    </select>
  </div>
</div>

Trabajo de demostración de JSFiddle

ACTUALIZACIÓN (31 de diciembre de 2015)

Si no desea establecer un valor predeterminado y desea eliminar la opción en blanco,

<select ng-model="feed.config" ng-options="template.value as template.name for template in feed.configs">
      <option value="" selected="selected">Choose</option>
</select>

Y en JS no es necesario inicializar el valor.

$scope.feed.config = $scope.feed.configs[0].value;

Si bien todas las sugerencias anteriores funcionan, a veces necesito tener una selección vacía (que muestre el texto del marcador de posición) cuando ingrese inicialmente a mi pantalla. Entonces, para evitar que el cuadro de selección agregue esta selección vacía al principio (o, a veces, al final) de mi lista, estoy usando este truco:

código HTML

<div ng-app="MyApp1">
    <div ng-controller="MyController">
        <input type="text" ng-model="feed.name" placeholder="Name" />
        <select ng-model="feed.config" ng-options="template.value as template.name for template in feed.configs" placeholder="Config">
            <option value="" selected hidden />
        </select>
    </div>
</div>

Ahora que ha definido esta opción vacía, el cuadro de selección está contento, pero lo mantiene oculto.

Aquí hay un violín actualizado: http://jsfiddle.net/UKySp/

Necesitaba establecer su valor de modelo inicial en el objeto real:

$scope.feed.config = $scope.configs[0];

Y actualice su selección para que se vea así:

<select ng-model="feed.config" ng-options="item.name for item in configs">

---

---

Utiliza Nuestro Buscador