使用 ng-repeat 时 datepicker 无法正常工作

Question

我在一个字段中使用 ng-repeat 需要有 datepicker.without ng-repeat 我的日期选择器在表格格式中工作正常但是当添加 ng-repeat 时我的 datepicker 无法正常工作得到“jquery-ui.js :8044 Uncaught Missing Missing instance data for this datepicker"。我试过下面的代码

 <td><input type="text" class="inputhistint datepickershiva"  id="datepicker2" ></td>
     <tr id="copartnerTr10" name="0"    ng-repeat="Details in DetailsList track by $index">
                        <td><input type="text" class="inputhistint datepickershiva`enter code here`"  id="datepicker2" ></td>
    </tr>

<script>
     jQuery.datepicker.regional['es'] = {
                    closeText: "Cerrar",
                    prevText: "&#x3C;Ant",
                    nextText: "Sig&#x3E;",
                    currentText: "Hoy",
                    monthNames: ["enero", "febrero", "marzo", "abril", "mayo", "junio",
                        "julio", "agosto", "septiembre", "octubre", "noviembre", "diciembre"
                    ],
                    monthNamesShort: ["ene", "feb", "mar", "abr", "may", "jun",
                        "jul", "ago", "sep", "oct", "nov", "dic"
                    ],
                    dayNames: ["domingo", "lunes", "martes", "miércoles", "jueves", "viernes", "sábado"],
                    dayNamesShort: ["dom", "lun", "mar", "mié", "jue", "vie", "sáb"],
                    dayNamesMin: ["D", "L", "M", "X", "J", "V", "S"],
                    weekHeader: "Sm",
                    dateFormat: "dd/mm/yy",
                    firstDay: 1,
                    isRTL: false,
                    showMonthAfterYear: false,
                    yearSuffix: ""
                };
                $.datepicker.setDefaults($.datepicker.regional['es']);


                $(function() {
                    $(".datepickershiva").datepicker({

                        buttonImage: "calendar.gif",
                    });

                });
</script>

我的指令是：

 .directive('datepicker', function() {
    return function($scope, element) {
      console.log(element);
      element.datepicker({
        minDate: 0,
        onSelect: function(y) {
          var edate = element.siblings('.edate');
          edate.datepicker();
          edate.datepicker('option', 'minDate', element.datepicker( "getDate" ));
        }
      });
    };
     });

Answer 1

它不会起作用，因为 id 应该是唯一的，您可以尝试通过动态生成 id ie 而不是 datepicker2 put $index，然后您的 id 将变得唯一，您必须使用 for 循环添加 datepicker。

或创建指令

.directive('datepicker', function() {
return function($scope, element) {
  console.log(element);
  element.datepicker({
    minDate: 0,
    onSelect: function(y) {
      var edate = element.siblings('.edate');
      edate.datepicker();
      edate.datepicker('option', 'minDate', element.datepicker( "getDate" ));
    }
  });
};
 });

并在 ng repeat 中实现它

<input type="text" class="inputhistint"  datepicker >