在ng-repeat中添加新的输入字段

时间:2015-06-26 10:55:12

标签: javascript angularjs angularjs-ng-repeat

http://jsfiddle.net/yhv9bjrx/2/

在上面的小提琴中,我试图让用户在点击新项目按钮时添加新的开放时间。我遇到的问题是,当点击按钮时,它会更新ng-repeat中的两个事件,而不是当前事件。

<ul>
      <li ng-repeat="event in orgEvents">
          <h3>Event ID: {{event.CampaignEventID}}</h3>
          <h2>Event Name: {{event.Name}}</h2>          
          <ul>
          <li ng-repeat="time in orgEventTimes">
              <div ng-if="time.CampaignEventID == 1">
                  Event ID: <input type="text" ng-model="time.CampaignEventID">
                  Open:  <input type="text" ng-model="time.OpenTime">
              </div>
          </li>
           <button ng-click="add(item)">New Item</button>

          </ul>
          <hr/>
      </li>
    </ul>

由于某种原因,ng-if语句不起作用,它显示$ scope.orgEventTimes数组中的每个事件,而不仅仅是属于此事件的事件。

1 个答案:

答案 0 :(得分:1)

https://jsfiddle.net/3aqwng8o/

我不知道为什么ng-if不起作用.. 而不是使用ng-if为什么不使用filter

<li ng-repeat="time in orgEventTimes|filter: {CampaignEventID:event.CampaignEventID}">

添加项目的按钮只是将空对象推入orgEventTimes数组。让它为ng-repeat循环的实例推送包含事件的CampaignEventID的对象。

   $scope.add = function (item) {
          $scope.orgEventTimes.push(item);
        };

<button ng-click="add({CampaignEventID: event.CampaignEventID})">New Item</button>