0

私の見解は次のとおりです。

  <div class="well well-sm" ng-repeat="item in receivingItems">
    {{ item.sku }}: {{ item.description }}<br />
    <form class="form-horizontal" role="form">
      <div class="form-group">
        <label class="col-sm-2 control-label">Quantity</label>
        <div class="col-sm-10">
          <input type="number" class="form-control" placeholder="">
        </div>
      </div>
      <div class="form-group">
        <label class="col-sm-2 control-label">Lot</label>
        <div class="col-sm-10">
          <input type="text" class="form-control" placeholder="">
        </div>
      </div>
    </form>
  </div>
  <form class="form-inline" role="form">
    <div class="form-group">
      <label class="sr-only">SKU</label>
      <input type="text" ng-model="receivingValue" placeholder="SKU" typeahead="sku for sku in getSku($viewValue) | filter:$viewValue" typeahead-on-select="selectedSku()" class="form-control" autocomplete="off" autocapitalize="off">
    </div>
  </form>

私のコントローラーには、次のものがあります。

  $scope.selectedSku = function() {
    var sku = $scope.receivingValue.split(':')[0];
    ItemService.getBySku(CompanyService.getCompany()._id, $scope.selectedClient._id, sku).then(function(response) {
      $scope.receivingItems.push(response.data.item);
      $scope.receivingValue = null;
    });
  }

したがって、これはあなたが期待することを行います。SKU を検索すると、数量とロットフィールドを含む新しいフォームが作成されます。しかし、フォーム全体を送信するときに、これらの値を何らかの方法で保存および保存したいと考えています。では、動的フィールド要素をどのように使用できますかng-model(または、使用する必要はありませんか?)

4

1 に答える 1

1

このようにng-formを使用することをお勧めします。これにより、フォームをフォーム内にカプセル化し、Angular が提供する検証機能を引き続き使用できます。

$scope.mySubmit = function(items) {
    myResource.ajaxProcessItems(items)
    .success(function(response) {
        //
    });
};

<div ng-form ng-submit="mySubmit(receivingItems)" name="myParentForm">
    <div class="well well-sm" ng-repeat="item in receivingItems">
        {{ item.sku }}: {{ item.description }}<br />
        <div ng-form class="form-horizontal" role="form" name="{{item.description}}">
          <div class="form-group">
            <label class="col-sm-2 control-label">Quantity</label>
            <div class="col-sm-10">
              <input type="number" 
                ng-model="item.sku"
                class="form-control"
                placeholder=""
                name="sku">
            </div>
          </div>
          <div class="form-group">
            <label class="col-sm-2 control-label">Lot</label>
            <div class="col-sm-10">
              <input type="text"
                class="form-control"
                placeholder=""
                ng-model="item.description"
                name="description" />
            </div>
          </div>
        </form>
    </div>
    <button type="submit">Submit</button>
</div>
于 2014-03-11T23:14:12.170 に答える