Javascript 如何使用AngularJS在下拉列表中设置值？

我需要如何使用angular.js在多个下拉列表中设置相同的值

<table class="table table-bordered table-striped table-hover" id="dataTable">
  <tr>
    <td width="100" align="center">Time <i class="fa fa-long-arrow-right"></i>
      <BR>Day <i class="fa fa-long-arrow-down"></i>
    </td>
    <td width="100" align="center" ng-repeat="hour in hours" ng-bind="hour"></td>
  </tr>
  <tbody id="detailsstockid">
    <tr ng-repeat="days in noOfDays">
      <td width="100" align="center" style=" vertical-align:middle" ng-bind="days"></td>
      <td width="100" align="center" style="padding:0px;" ng-repeat="hour in hours">
        <table style="margin:0px; padding:0px; width:100%">
          <tr>
            <td>
              <select id="coy" name="coy" class="form-control" ng-model="sub_name " ng-options="sub.name for sub in listOfSubjectName track by sub.value">  
            </select>
            </td>
          </tr>
          <tr>
            <td>
              <select id="coy" name="coy" class="form-control" ng-model="fac_name " ng-options="fac.name for fac in listOfFacultyName track by fac.value">  
            </select>
            </td>
          </tr>
      </td>
      </table>
      </td>
    </tr>
  </tbody>
</table>

时间

一天

这里的值在此表的每一行中动态设置，并且所有行和列的值也相同。下面给出了我的控制器文件代码

 $scope.noOfDays = [];

        $scope.days = {
          '0': "Monday",
          '1': 'Tuesday',
          '2': 'Wednesday',
          '3': 'Thursday',
          '4': 'Friday'
        }

        $scope.hours = [
          '9AM :: 10AM',
          '10AM :: 11AM',
          '11:15AM :: 12:15PM',
          '12:15PM :: 01:15PM',
          '02PM :: 03PM',
          '03PM :: 04PM',
          '04PM :: 05PM'
        ]

        for (var i = 0; i < 5; i++) {
          $scope.noOfDays.push($scope.days[i]);
        }
        $scope.listOfSubjectName=[{
        name: 'Select Cource',
        value: ''
        }]
        $scope.listOfFacultyName=[{
        name: 'Select Faculty',
        value: ''
        }]

$scope.noOfDays=[]；
$scope.days={
“0”：“星期一”，
‘1’：‘星期二’，
"2":"星期三",，
"3":"星期四",，
‘4’：‘星期五’
}
$scope.hours=[
“上午9点：上午10点”，
“上午10点：上午11点”，
“上午11:15：：下午12:15”，
“下午12:15:：01:15”，
“下午2点：下午3点”，
“03PM:：04PM”，
'04PM:：05PM'
]
对于（变量i=0；i<5；i++）{
$scope.noOfDays.push（$scope.days[i]）；
}
$scope.listOfSubjectName=[{
名称：'Select Cource'，
值：“”
}]
$scope.listOfFacultyName=[{
名称：“选择教员”，
值：“”
}]

---

在这里，我需要假设我从

选择课程

中选择了一个值，该值位于

'12:15PM:：01:15PM'

下，所选值将在选择课程下拉列表中设置，该列表位于接下来的3组时间下（

即-'02PM:：03PM'、'03PM:：04PM'、'04PM:：05PM

）自动和显示。我可以从任何位置选择值，但在这之后，所选值应设置下3组下拉列表。请帮助我。

控件中的选定项和listOfSubjectName.name的值具有双绑定。因此，在JavaScript中更改listOfSubjectName.name，或更改控件中的值，更新另一个。如果listOfSubjectName.name的值为0，则应选择该项

listOfSubjectName是一个数组，listOfSubjectName.name必须设置为这些对象之一。因此，您可以通过代码更改在下拉列表中看到的内容

       $scope.listOfSubjectName = [{ name: "a", id: 1 }, { name: "b", id: 2 }];
    //default selected value is listOfSubjectName[0] but if you want selected value can listOfSubjectName[1]
        $scope.sub_name= $scope.listOfSubjectName [1];
//select subject name add into the FacultyName array
 $scope.listOfFacultyName=[{
        name: 'Select Faculty',
        value: '',
        currentsubjectName:$scope.sub_name,
        }]

html部分回顾：

<select id="coy" name="coy" class="form-control" ng-model="fac_name.currentsubjectName" ng-options="fac.name for fac in listOfFacultyName track by fac.value"> 

---

以下是您要查找的内容。您必须通过调用

ng change

事件上的方法触发下一个选择项的更改，如下所示：

方法应如下所示：

$scope.setFac=函数（天，小时）{
控制台日志（“设置fac”+天+”，“+小时）；
var-next=0；
$scope.hours.forEach（功能（hr）{
如果（hr==小时| |下一个）{
next++；
}
如果（下一个>0&&下一个<4）{
$scope.fac_name[day+hr]=$scope.fac_name[day+hour]；
}
否则{
//清除以前的选择
$scope.fac_name[day+hr]=null；
}
});
};  
$scope.setSub=功能（天，小时）{
控制台日志（“设置子项”+天+”，“+小时）；
var-next=0；
$scope.hours.forEach（功能（hr）{
如果（hr==小时| |下一个）{
next++；
}
如果（下一个>0&&下一个<4）{
$scope.sub_name[day+hr]=$scope.sub_name[day+hour]；
}
否则{
//清除以前的选择
$scope.sub_name[day+hr]=null；
}
});
};

在这里，您需要利用

天

和

小时

值在每个

选择

项目中唯一地识别您的模型。否则，当选择一个元素时，所有

select

元素将获得相同的值

---

编辑：根据评论修改代码

@Yasemin:它将如何设置为下一个3下拉列表。您选择的值$scope.sub_name作为参数添加到其他数组中。您可以编辑您试图说的代码吗？我不清楚。谢谢它的工作，但有一个小问题，假设第一组值已更改选中，如果用户选择任何第二组值，第一组将恢复正常状态。不确定您的意思。但如果需要清除以前选择的值，在应用新值之前，您需要循环该行的

日+小时组合

，并将

$scope.sub_name

或

$scope.fac_name

设置为null。我的意思是假设用户选择了前3个设置值。如果他选择了任何其他设置值，则之前的值将为null。您能否在中为此添加代码JSFIDLE。将此新更新签出到FIDLE:。如果解决方案对您有效，请标记为已接受，以供其他访客参考。

<select class="form-control" ng-model="sub_name[days + hour]" ng-change="setSub(days, hour)"  ng-options="sub.name for sub in listOfSubjectName track by sub.value">

$scope.setFac = function(day, hour){
    console.log("set fac "+ day + ", " + hour);
    var next = 0;
    $scope.hours.forEach(function(hr){
        if(hr === hour || next){
            next++;
        }
        if(next > 0 && next < 4){
            $scope.fac_name[day + hr] = $scope.fac_name[day + hour];
        }
        else{
            // clear previous selection
            $scope.fac_name[day + hr] = null;
        }
    });
};  

$scope.setSub = function(day, hour){
    console.log("set sub "+ day + ", " + hour);
    var next = 0;
    $scope.hours.forEach(function(hr){
        if(hr === hour || next){
            next++;
        }
        if(next > 0 && next < 4){
            $scope.sub_name[day + hr] = $scope.sub_name[day + hour];
        }
        else{
            // clear previous selection
            $scope.sub_name[day + hr] = null;
        }
    });
};