本文介绍了从下拉列表中选择时,Angular JS ng-model变为空的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧! 问题描述 29岁程序员,3月因学历无情被辞! 我是角js的新手。我正在创建一些应用程序,我从下拉列表中选择一个值,并且所选值与ng-model相关联。但我发现ng-model实际上变成了null而不是获取值。 我的整个代码是:I am a novice in angular js. I am creating some application where i am selecting a value from drop down list and the selected value is associated with ng-model. But i see that the ng-model is actually becoming null instead of gettting a value.My whole code is:<html><head> <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.js"></script></head><body><div ng-app="app"> <div ng-controller="MyCtrl"> <h2>Select one Item from left and one Item from right</h2> <select ng-model="leftmodel" ng-change="ChangeOptions()" ng-options="option as option.value disable when option.disabled for option in left"> </select> <select ng-model="rightmodel" ng-change="ChangeOptions()" ng-options="option as option.value disable when option.disabled for option in right"> </select> </div></div><script> var module = angular.module("app", []); module.controller("MyCtrl", function($scope) { $scope.left = [{ "name": "apple", "value": "Nice Apple", "disabled": false }, { "name": "orange", "value": "Yellow Orange", "disabled": true }, { "name": "berry", "value": "Blue Berry", "disabled": false }]; $scope.right = [{ "name": "apple", "value": "Nice Apple", "disabled": true }, { "name": "orange", "value": "Yellow Orange", "disabled": false }, { "name": "berry", "value": "Blue Berry", "disabled": false }]; $scope.leftmodel = $scope.left[0]; $scope.rightmodel = $scope.right[1]; $scope.ChangeOptions = function() { var size = $scope.left.length; console.log(size); console.log($scope.leftmodel); console.log($scope.rightmodel); for (var i = 0; i < size; i++) { if ($scope.left[i].name === $scope.rightmodel.name) { $scope.right[i].disabled = true; } else { $scope.right[i].disabled = false; } } for (var i = 0; i < size; i++) { if ($scope.right[i].name === $scope.leftmodel.name) { $scope.left[i].disabled = true; } else { $scope.left[i].disabled = false; } } }; } );</script></body></html>我还有 Codpen 在控制台中我收到以下错误:I also have a CodpenIn console i get the following errors:推荐答案试试这个。$scope.ChangeOptions = function() { var lsize = $scope.left.length; var rsize = $scope.left.length; for (var i = 0; i < lsize; i++) { console.log($scope.left[i]); if ($scope.left[i].name === $scope.rightmodel.name) { $scope.left[i].disabled = true; } else { $scope.left[i].disabled = false; } } for (var i = 0; i < rsize; i++) { if ($scope.right[i].name === $scope.leftmodel.name) { $scope.right[i].disabled = true; } else { $scope.right[i].disabled = false; } } };代码笔: https://codepen.io/anon/pen/dNYLpN 这篇关于从下拉列表中选择时,Angular JS ng-model变为空的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持! 上岸,阿里云!
08-26 06:16