[英]Select option using ng-repeat not selecting if assigned value is Number , Angular 1.6
我在Angular 1.6中遇到了一个特有的问题，相同的代码对于Angular 1.2来说也可以正常工作 ，当我们尝试使用Number分配ng-repeat创建的下拉列表的选定值时，它没有被选中，但是指定了模型值。
检查下面的示例，我分配了$scope.selectedOne = 1; 与数字和$scope.selectedTwo = "1"; 如果使用字符串，则不会选择第一个下拉菜单，而选择第二个下拉菜单。 我在下拉菜单中使用相同的项目。 相同的代码在Angular 1.2中正常工作（两种情况都选择）。
谁能解释这两个版本的区别
var app = angular.module('app', []); app.controller('homeCtrl', ['$scope', function($scope) { $scope.selectedOne = 1; $scope.selectedTwo = "1"; $scope.items = [{ name: 'harry111', id: 1 }, { name: 'rimmi', id: 2 } ]; }]);
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.min.js"></script> <html> <head> </head> <body ng-app="app"> <div ng-controller="homeCtrl"> <select ng-model="selectedOne"> <option ng-repeat="item in items" value="{{item.id}}"> {{item.name}} </option> </select> <div> selectedOne :{{selectedOne}} </div> <select ng-model="selectedTwo"> <option ng-repeat="item in items" value="{{item.id}}"> {{item.name}} </option> </select> <div> selectedOne :{{selectedOne}} </div> </div> </body> </html>
在回答了stackoverflow.com/questions/44799901/…这个问题后，我遇到了这个问题，该问题在Angular 1.2（两种情况下均选择）中工作得很好。
从v1.6开始，ngValue还将设置元素的value属性（除了value属性之外）。 它可能不会影响您的用例，但这是另一个需要牢记的差异。
请查看下面的讨论：
实际上，此更改是在从angularjs 1.3迁移到1.4的过程中发生的，因此从迁移发行指南doc中可以得出：
由于7fda214c ，select指令现在将使用ngModel范围值与选项值的严格比较来确定选择哪个选项。 这意味着非字符串范围值（例如Number或Boolean）将不会与等效的选项字符串（例如字符串“ 123”，“ true”或“ false”）匹配。
要解决此问题，请使用ng-value ，演示：
var app = angular.module('app', []); app.controller('homeCtrl', ['$scope', function($scope) { $scope.change = function() { alert(typeof $scope.selectedOne ); alert(typeof $scope.selectedTwo ); } $scope.selectedOne = 1; $scope.selectedTwo = "1"; $scope.items = [{ name: 'harry111', id: 1 }, { name: 'rimmi', id: 2 } ]; }]);
<script src="https://code.angularjs.org/1.6.2/angular.js"></script> <html> <head> </head> <body ng-app="app"> <div ng-controller="homeCtrl"> <select ng-change="change()" ng-model="selectedOne"> <option ng-repeat="item in items" ng-value="{{item.id}}"> {{item.name}} </option> </select> <div> selectedOne :{{selectedOne}} </div> <select ng-change="change()" ng-model="selectedTwo"> <option ng-repeat="item in items" value="{{item.id}}"> {{item.name}} </option> </select> <div> selectedOne :{{selectedOne}} </div> </div> </body> </html>
角度选择ng选择不起作用 <option ng-repeat> ）
[英]angular select ng-selected not working (with <option ng-repeat>)
使用ng-repeat或ng-options选择框角，并删除空白选项
[英]Select box angular using ng-repeat or ng-options and removing blank option
选择选项中的角度ng-repeat显示额外空间而不选择默认值。
[英]Angular ng-repeat in select options showing extra space and not selecting default value.
选择的Angular ng-repeat，使用$ rootScope变量设置一个选项
[英]Angular ng-repeat for a select, setting one option as selected using $rootScope variable
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.