这段代码中出现了什么是空白选项？

我似乎无法让这个空白选项消失。有关如何做的建议？ AngularJS没有给我任何有用的信息，我尝试了很多来自Stackoverflow的建议。这段代码中出现了什么是空白选项？

angular.module("myApp", []); 
 

 
angular.module("myApp").component("app", { 
 
    template: ` 
 
    <div> 
 
     <select 
 
     ng-model="$ctrl.foo" 
 
     ng-options="day.value as day.label for day in $ctrl.days track by day.value" 
 
     ></select> 
 
    </div> 
 
    `, 
 
    controller: function() { 
 
    this.days = _.range(0, 31).map(function(day) { 
 
     if (day === 0) return {label: "No Wait", value: day}; 
 
     return {label: "" + day, value: day}; 
 
    }); 
 
    this.foo = 2; 
 
    } 
 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script> 
 
<script src="https://code.angularjs.org/1.6.5/angular.js"></script> 
 

 
<body ng-app="myApp"> 
 
    <app></app> 
 
</body>

来源

2017-09-07 Fire-Dragon-DoL

不要以为你可以摆脱它，请参阅[为什么AngularJS包括选择空选项？]（https://stackoverflow.com/questions/12654631/why-does-angularjs-include-an-empty-option-in-select） – user2718281

更改'''this.foo = 2;'' 'to this'''this.foo = {value：2};''' –

[为什么AngularJS在select中包含一个空选项？]（https://stackoverflow.com/questions/12654631/why -does-angularjs-include-an-empty-option-in-select） –

更改this.foo = 2;对象分配this.foo = { value: 2 };

来源

2017-09-07 00:23:43

'''day.value as ...'在'ng-options'中使用，因此直接分配值应该可行。 – Icycool

是的，我可以证实，'day.value'应该完美运作，我不希望整个对象回来，只有值。 –

好像卸下track by部分将解决这个问题

ng-options="day.value as day.label for day in $ctrl.days"

来源

2017-09-07 04:30:12 Icycool

但是，这将强制在我的所有对象上存在'$$ hashKey'，因为所有对象都是基于'day.value'唯一的，所以我确实不需要它。 –

[documentation]中有一个特定的部分（https ：//docs.angularjs.org/api/ng/directive/ngOptions#-select-as-），也许可以有一些方法来实现它。 – Icycool

我解决了这个。我不能让ng-options正常工作，但ng-repeat上option与ng-value的伎俩：

angular.module("myApp", []); 
 

 
angular.module("myApp").component("app", { 
 
    template: ` 
 
    <div> 
 
     <select 
 
     ng-model="$ctrl.foo" 
 
     > 
 
     <option 
 
      ng-repeat="day in $ctrl.days track by day.value" 
 
      ng-value="day.value" 
 
     > 
 
      {{day.label}} 
 
     </option> 
 
     </select> 
 
    </div> 
 
    `, 
 
    controller: function() { 
 
    this.days = _.range(0, 31).map(function(day) { 
 
     if (day === 0) return {label: "No Wait", value: day}; 
 
     return {label: "" + day, value: day}; 
 
    }); 
 
    this.foo = 2; 
 
    } 
 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script> 
 
<script src="https://code.angularjs.org/1.6.5/angular.js"></script> 
 

 
<body ng-app="myApp"> 
 
    <app></app> 
 
</body>

来源

2017-09-08 22:35:47

这段代码中出现了什么是空白选项？

回答

相关问题