Ng-repeat for tr动态添加行

ng-repeat for tr to add rows dynamically.

本文关键字：添加行 动态 tr for Ng-repeat      更新时间：2023-09-26
<tr class="workTime" ng-repeat="worktime in doctor.shift" >                                 
    <td><select name="multipleSelect" class="form-control selectpicker"          
     id="multipleSelect" ng-model="doctor.shift.workDays" multiple>
          <option ng-repeat="days in weekdays">{{days}}</option>                                      
       </select>
   </td>
   <td><input type="text" class="form-control" ng-model =                      
    "doctor.shift.workFrom"></td>
    <td><input type="text" class="form-control" ng-model =     
     "doctor.shift.workTo">   
    </td>
    <td><span class="glyphicon **glyphicon-plus** glyph_size "  ng-
     click="addWorkTime()" aria-hidden="true "></span></td>
</tr>

我是Angular新手。我想重复一下图标加号的点击。我不知道该怎么做。我没有获取任何数据。我只是想添加一行与相应的字段在点击glyphicon +。有人能帮我解决这个问题吗?如果我要写剧本的话。写

要用什么脚本呢?

好，下面是排序的答案:

var app = angular.module('main', []); 
app.controller('ctrl', function ($scope) {
    // create an object to hold the collection
    $scope.doctor = {
        shift : {
        worktimes: []
      }
    };
    $scope.addWorkTime = function() {
        // add an element to the end of the array
      $scope.doctor.shift.worktimes.push( {
                workDay: 1,
            workFrom: '9:00',
            workTo: '22:00'
      });
    };
    // add an initial row - if there are no rows, there's no add button!
    $scope.addWorkTime();
});

https://jsfiddle.net/cglist/t661eh5y/5/?utm_source=website& utm_medium = embed& utm_campaign = t661eh5y

长篇大论的回答是，你的html中有一些有趣的东西，这表明你刚刚开始使用Angular。首先，当你说:Ng-repeat ="医生轮班的工作时间"…"worktime"是一个临时变量，仅用于遍历对象或(更有可能的)集合。因此，在重复的模板中，您希望绑定到如下内容:"worktime.workFrom"您将看到，我调整了html和数据模型以使其全部工作，同时尝试猜测您想要完成的内容。

接下来，对于选择框中的选项，当前的方式是使用"ngOptions"，而不是"ngRepeat": https://docs.angularjs.org/api/ng/directive/ngOptions

相关文章：