我如何使用$ index跟踪从AngularJs的文本字段中获取值

debugcn 发表于 Dev

1未来

对...在我的控制器中，我有一个像这样的数组：

$scope.EmployeeTimes = [{Day: 'Monday',StartTime: '08:00', FinishTime: '5:00'},
                       { Day: 'Tuesday',StartTime: '08:00', FinishTime: '5:00'},
                       {Day: 'Wed',StartTime: '08:00', FinishTime: '5:00'},
                       {Day: 'Thursday',StartTime: '08:00', FinishTime: '5:00'}]

然后我像这样在我的观点中传递并循环遍历上面的上下文：

 <div ng-repeat="a in EmployeeTimes track by $index">
                    <input type="text" ng-model="a.Day">
                    <input type="text" ng-model="a.StartTime">
                    <input type="text" ng-model="a.Finish">
                </div>

如您所见，即时消息使用$ index跟踪，这会自动创建我需要的所有文本字段。现在如何从文本字段中获取每个值？因此，在上述情况下，我需要如何为给定员工从星期一至星期四获取StartTime和finishTime。如何获得这些价值？基本上，我试图避免在星期一至星期四之前创建startTIme和FinishTime文本框，因此为什么要使用轨道索引。我该如何实现呢？

格雷戈里

这是一个CodePen，其中包含基于您的代码的工作示例：更改内容，按“过程数据”链接，然后查看您的控制台。

由于有了Angular绑定，您在更改文本字段中的内容后就可以立即更新Javascript模型。如果要访问星期一的开始时间，请执行以下操作：


    $ scope.EmployeeTimes [0] .StartTime

您可以更改时间，然后单击“处理”。如果您查看控制台，您将在控制器中看到更新的数据。在控制台中，将星期二的StartTime更改为“ 02:00”后，我看到以下内容：


    正在处理... 
    console_runner-d0a557e….js：1天：星期一开始时间：08：00完成时间：5：00 
    console_runner-d0a557e….js：1天：星期二开始时间：02：00完成时间：5：00 
    console_runner-d0a557e… .js：1天：周三开始时间：08：00完成时间：5：00 
    console_runner-d0a557e….js：1天：周四开始时间：08：00完成时间：5：00

这是“流程”链接所调用的函数：

 $scope.go = function() {
    console.log('Processing...');
    for (var i = 0 ; i < $scope.EmployeeTimes.length; i++) {
      console.log('Day: '+$scope.EmployeeTimes[i].Day+' StartTime: '+$scope.EmployeeTimes[i].StartTime+' FinishTime: '+$scope.EmployeeTimes[i].FinishTime);
    }

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。