Remover opção em branco da opção Select com AngularJS

Eu sou novo no AngularJS. Eu procurei muito, mas isso não resolve o meu problema.

Eu estou recebendo uma opção em branco pela primeira vez na checkbox de seleção.

Aqui está o meu código HTML

{{template.name}}

JS

 var MyApp=angular.module('MyApp1',[]) MyApp.controller('MyController', function($scope) { $scope.feed = {}; //Configuration $scope.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.configs[0].value; }); 

Mas isso não parece funcionar. Como posso resolver isso? Aqui está o JSFiddle Demo

Para referência: Por que o angularjs inclui uma opção vazia em select ?

A option vazia é gerada quando um valor referenciado por ng-model não existe em um conjunto de opções passadas para ng-options . Isso acontece para evitar a seleção acidental do modelo: o AngularJS pode ver que o modelo inicial é indefinido ou não no conjunto de opções e não quer decidir o valor do modelo sozinho.

Em suma: a opção vazia significa que nenhum modelo válido é selecionado (por válido quero dizer: do conjunto de opções). Você precisa selecionar um valor de modelo válido para se livrar dessa opção vazia.

Mude seu código como este

 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; }); 
   

Enquanto todas as sugestões acima estão funcionando, às vezes eu preciso ter uma seleção vazia (mostrando o texto do espaço reservado) quando inicialmente entrar na minha canvas. Então, para evitar que a checkbox de seleção adicione essa seleção vazia no início (ou às vezes no final) da minha lista, estou usando este truque:

Código HTML

 

Agora você definiu essa opção vazia, portanto, a checkbox de seleção está feliz, mas você a mantém oculta.

Aqui está um violino atualizado: http://jsfiddle.net/UKySp/

Você precisava definir seu valor de modelo inicial para o object real:

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

E atualize seu select para ficar assim:

  

Outro método para resolver é fazer uso de: $first in ng-repeat

Uso:

  

Referências :

ngSelected : https://docs.angularjs.org/api/ng/directive/ngSelected

$ primeiro : https://docs.angularjs.org/api/ng/directive/ngRepeat

Felicidades

É uma espécie de solução, mas funciona como um encanto. Basta adicionar como um preenchimento. Como em:

  

Existem várias maneiras como –

  

Ou

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

Se você quiser apenas remover o espaço em branco, use ng-show e pronto! Não há necessidade de inicializar valor em JS.

 ` 

Mude seu código assim. Você esquece o valor dentro da opção. Antes de atribuir o modelo ng. Deve ter um valor. Só então ele não recebe o valor indefinido.

 

JS

  var MyApp=angular.module('MyApp1',[]) MyApp.controller('MyController',function($scope) { $scope.feed = 'config1'; $scope.configs = [ {'name': 'Config 1', 'value': 'config1'}, {'name': 'Config 2', 'value': 'config2'}, {'name': 'Config 3', 'value': 'config3'} ]; }); 

Além disso, verifique se você tem algum valor falso ou não. Angularjs irá inserir uma opção vazia se você tiver valor falsamente. Eu lutei por 2 dias apenas devido ao valor falso. Espero que seja útil para alguém.

Eu tinha opções como [0, 1] e inicialmente eu estava definido o modelo para 0 devido a que ele foi inserido opção vazia. A solução alternativa para isso era [“0”, “1”].