Question

因此我创建了一个按钮，用于使用ng-click功能打开日历：

<button type="button" class="btn btn-default" ng-click="main.open_date()">
    <i class="glyphicon glyphicon-calendar"></i>
</button>

我将其放在ng-repeat中，当我添加更多字段并测试按钮时，发生了这种情况：

由ng-repeat创建的行不是唯一的，因为它们具有自己的索引吗？我在这里想念什么？

更新：这是我的main.open_date（）的代码：

me.open_date = function(key){
    if(!key){key='date';}
    me.uibdates[key] = true;
}

模板代码：

<tr ng-repeat="detail in main.employee_details track by $index">
    <td>
        <ui-select ng-model="detail.status" theme="bootstrap">
            <ui-select-match placeholder="Select status" allow-clear>{$$select.selected.name$}</ui-select-match>
            <ui-select-choices repeat="status in main.status | propsFilter: {name: $select.search} | limitTo: 100">
                <div ng-bind-html="status.name | highlight: $select.search"></div>
            </ui-select-choices>
        </ui-select>
    </td>
    <td>
        <p class="input-group">
            <span class="input-group-btn">
                  <button type="button" class="btn btn-default"
                          ng-click="main.open_date()">
                      <i class="glyphicon glyphicon-calendar"></i>
                  </button>
            </span>
            <input type="text" class="form-control" placeholder="Select date"
                   uib-datepicker-popup="MM/dd/yyyy"
                   ng-model="detail.date" is-open="main.uibdates['date']" 
                   ng-change="main.date_change()" />
        </p>
    </td>
    <td>
        <input type="text" class="form-control" ng-model="detail.remark" placeholder="">
    </td>
    <td>
        <button style="display: inline; width: 35px;"class="form-control btn btn-primary btn-sm" ng-click="main.add_field($index);" ng-if="$index == (main.employee_details.length - 1)">
            <span class="glyphicon glyphicon-plus"></span>
        </button>
        <button style="display: inline; width: 35px;" class="form-control btn btn-danger btn-sm" ng-click="main.delete_field($index);" ng-if="main.employee_details.length != 1">
            <span class="glyphicon glyphicon-trash"></span>
        </button>
    </td>
</tr>

Answer 1

在我的想象中，您可以自定义代码： HTML：


    <div ng-repeat="item in listItems track by item.id + $index">
        <input class="datetime-picker" id="datepicker_{{item.id}}" />
        <button ng-click="main.open_date(item.id)" class="open-datetime-picker">Open</button>
    </div>

Angularjs


    main.open_date = function(id){
        $("datepicker_" + id).datetimepicker();
    }

Answer 2

ng-repeat内的所有内容都重复，但索引除外。如果您不使用索引，则按钮不是唯一的。

Answer 3

在main.open_date（）函数中，您可以使用id代替class还是html标记

喜欢

$('#datetimepicker1').datetimepicker();

Answer 4

您是否在ng-repeat中添加了$ index？示例：listdivs中的

跟踪

或者，如果您的商品具有ID字段：

进行跟踪

ng-repeat重复ng-click功能

4 个答案: