Question

我遇到了问题。我有两个具有相同值的下拉列表。但是当我将任何值设置为第一个下拉列表时，第二个就是采用那个值。我在下面解释我的代码。

<div class="col-md-6">
<div class="input-group bmargindiv1 col-md-12">
    <span class="input-group-addon ndrftextwidth text-right" style="width:180px">Day Form :</span>
    <select class="form-control"  id="daysFrom" ng-model="daysFrom" ng-options="qua.name for qua in listOfDays track by qua.value ">
    </select>
</div>
</div>
<div class="col-md-6">
    <div class="input-group bmargindiv1 col-md-12">
        <span class="input-group-addon ndrftextwidth text-right" style="width:180px">Day To :</span>
        <select class="form-control"  id="daysTo" ng-model="daysTo" ng-options="qu.name for qu in listOfDays track by qu.value ">
        </select>
    </div>
</div>

这里我有两个下拉菜单，假设我将值设置为第一个，如下所示。

 $scope.daysFrom.value=2;

$scope.listOfDays=[{
        name:'Select Day',
        value:''
    }]
    $scope.daysFrom=$scope.listOfDays[0];
    $scope.daysTo=$scope.listOfDays[0];
    $http({
        method:'GET',
        url:"php/customerInfo.php?action=day",
        headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
    }).then(function successCallback(response){
        angular.forEach(response.data,function(obj){
            var data={'name':obj.day_name,'value':obj.day_id};
            $scope.listOfDays.push(data);

        })
    },function errorCallback(response) {
    })

第二个也采用了不应该发生的相同值。我需要为下拉列表设置不同的值。请帮帮我。

Answer 1

$scope.daysFrom和$scope.daysTo都是对同一对象$scope.listOfDays[0]的引用。对任何这些对象的更改都将反映在所有这些对象中。

要解决此问题，您可以使用angular.copy。这是一个例子：

$scope.daysFrom = angular.copy($scope.listOfDays[0]);
$scope.daysTo = angular.copy($scope.listOfDays[0]);

使用Angular.js在下拉列表中动态设置值时出现问题

1 个答案: