Question

我有一个显示为ng-repeat的数组，还有一个表单可以向此数组添加数据。
但我不想使用按钮提交此表单，所以我使用{在每个输入中{1}}并调用一个向我的数组添加数据的函数，但是存在问题。
当我使用ng-blur按钮转到下一个输入时，会添加数据，但我再次输入空表格的第二个输入

您可以在此处查看我的示例：link

HTML CODE

tab

脚本代码

<form ng-submit="addJobRecord()" id="job_records" class="ui-state-default info_box">
  <a class="sortable-handler">
    <i class="fa fa-arrows"></i>
  </a>
  <h4>old form</h4>
  <div ng-repeat="x in job_records" class="info_box_body">
    <div>
      <div class="col-sm-6 pull-right">
        <label>name: </label>
        <input class="form-control" id="job_record_name" type="text" name="job_record_name" value="{{x.name}}" />
      </div>
      <div class="col-sm-6 pull-right">
        <label>title: </label>
        <input class="form-control" id="job_record_title" type="text" name="job_record_title" value="{{x.title}}" />
      </div>
    </div>
    <div>
      <div class="col-sm-6 pull-right">
        <label>group: </label>
        <input class="form-control" id="job_record_group" type="text" name="job_record_group" value="{{x.group}}" />
      </div>
      <div class="col-sm-6 pull-right">
        <label>situation: </label>
        <input class="form-control" id="job_record_situation" type="text" name="job_record_situation" value="{{x.situation}}" />
      </div>
    </div>
    <div class="clearfix"></div>
    <hr>
  </div>
  <div class="info_box_body" name="helpForm">
    <h4>empty form</h4>
    <div>
      <div class="col-sm-6 pull-right">
        <label>name: </label>
        <input ng-blur="addJobRecord()" class="form-control" type="text" id="new_job_record_name" ng-model="JobRecordform.newJobName" placeholder="name" />
      </div>
      <div class="col-sm-6 pull-right">
        <label>title: </label>
        <input ng-blur="addJobRecord()" class="form-control" type="text" id="new_job_record_title" ng-model="JobRecordform.newJobTitle" placeholder="title" />
      </div>
    </div>
    <div>
      <div class="col-sm-6 pull-right">
        <label>group: </label>
        <input ng-blur="addJobRecord()" class="form-control" type="text" id="new_job_record_group" ng-model="JobRecordform.newJobGroup" placeholder="group" />
      </div>
      <div class="col-sm-6 pull-right">
        <label>situation: </label>
        <input ng-blur="addJobRecord()" class="form-control" type="text" id="new_job_record_situation" ng-model="JobRecordform.newJobSit" placeholder="situation" />
      </div>
    </div>
  </div>
</form>

Answer 1

在将其推送到数组之前，您只需检查$ scope值是否为null。我已经更新了你的plunker。请检查

Angularjs将数据添加到数组而不提交表单按钮

1 个答案: