Angular js：angular datepicker未正确显示在表td中

Question

我在数据表中使用日期选择器，表格是可编辑的表格，并且带有ng-repeat

的tr

但是没有以适当的方式显示。我希望外部表格中的日期选择器显示意味着像弹出窗口，但目前在表格中显示日期选择器，如果我有两行而不是两个日期选择器显示相同的时间。

这是截图：

这是我的表格代码：

<div class="row form-group">
            <table datatable="ng" class="row-border hover table table-responsive">
                <thead>
                    <tr>
                        <th class="thbg">{{'product.PRODUCTSR'| translate}}</th>
                        <th class="thbg wd-half">Vendor Name</th>
                        <th class="thbg wd-half">Date</th>
                        <th class="thbg wd-half">Price</th>
                        <th class="thbg wd-half">Qty.</th>
                        <th class="thbg">{{'product.PACTION'| translate}}</th>
                    </tr>
                </thead>
                <tbody>
                    <tr ng-repeat="list in table.process_data.price_list">
                        <td>{{$index + 1}}</td>
                        <td>
                            <span ng-hide="list.editMode">{{list.vendor_name}}</span>
                            <select class="chosen-select form-control input-md" placeholder="{{'salesorder.Selectsaleentryunit'| translate}}"
                                    width="'300px'" name="list.vendors" ng-show="list.editMode"
                                    ng-model="list.id_crm_entry" >
                                <option value="">Select Vendor</option>
                                <option ng-repeat="type in table.formPreData.crm_ven" ng-selected="list.id_crm_entry == type.id" 
                                        ng-value="type.id" value="type.name">{{type.name}}</option>
                            </select>
                        </td>
                        <td>

                            <span ng-hide="list.editMode">{{list.date_update}}</span>
                            <div class="input-group" style="position: static;">
                                <input class="form-control" type="text" uib-datepicker-popup="{{table.format}}"
                                       ng-model="list.date_update" ng-value="list.date_update" ng-show="list.editMode"
                                       is-open="table.dt_picker[0]"
                                       datepicker-options="table.dateOptions" date-disabled="table.disabled(date, mode)"
                                       close-text="Close" placeholder="Update Date" name="list.date_update"/>
                                <span class="input-group-btn">
                                    <button class="btn btn-info" ng-show="list.editMode" ng-click="table.open_dt_picker(0)">
                                        <em class="fa fa-calendar"></em>
                                    </button>
                                </span>
                            </div>

                        </td>
                        <td>
                            <span ng-hide="list.editMode">{{list.price}}</span>
                            <input class="form-control" type="text" ng-show="list.editMode" ng-model="list.price" />
                        </td>
                        <td>
                            <span ng-hide="list.editMode">{{list.qty}}</span>
                            <select class="chosen-select form-control input-md"
                                    width="'300px'" name="list.qty_min"
                                    ng-model="list.id_prd_qty_min" ng-show="list.editMode">
                                <option value="">Select Vendor</option>
                                <option ng-repeat="type in table.formPreData.qty_min" ng-selected="list.id_prd_qty_min == type.id" 
                                        ng-value="type.id" value="type.name">{{type.name}}</option>
                            </select> 
                        </td>
                        <td>
                            <button type="button" ng-hide="list.editMode" class="btn btn-default"
                                    ng-click="list.editMode = true; table.editPrice(list)">
                                <i class="fa fa-pencil fa-lg"></i>
                            </button>
                            <button type="button" ng-show="list.editMode" class="btn btn-default"
                                    ng-click="table.saveField(list)">
                                <i class="fa fa-save fa-lg"></i> 
                            </button>
                            <button type="button" ng-show="list.editMode" class="btn btn-default"
                                    ng-click="table.cancel(list, $index)">
                                <i class="fa fa-close fa-lg"></i>
                            </button>
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>

这是我的JS：

         vm.dt_picker = [];
         vm.dt = [];
         vm.today = function () {
           vm.dt = new Date();
       };
        // vm.today();

        vm.clear = function () {
            vm.dt = null;
        };

        // Disable weekend selection
        vm.disabled = function (date, mode) {
            return (mode === 'day' && (date.getDay() === 0 || date.getDay() === 6));
        };

        vm.toggleMin = function () {
            vm.minDate = vm.minDate ? null : new Date();
        };
        vm.toggleMin();

        vm.open_dt_picker = function (index) {
            vm.dt_picker[index] = true;
        };

        vm.dateOptions = {
            formatYear: 'yy',
            startingDay: 1
        };

        vm.initDate = new Date('2019-10-20');
        vm.formats = ['dd-MMMM-yyyy', 'yyyy-MM-dd', 'dd.MM.yyyy', 'shortDate'];
        vm.format = vm.formats[1];