これは角形だけを使って可能ですか？

私はこのフォームをAngularJS hereを使って作成しました。これは基本的にサーバーに送信する購入オブジェクトを作成することができます。つまり、商品を購入した店舗を選択し、「購入日」を設定します今のところテキストフィールド）、それらのアイテムを私が送るつもりのオブジェクトに追加します。これは角形だけを使って可能ですか？

送信ボタンの後に、モデルの送信方法、店舗のID、「日時」、およびアイテムの配列が表示されます。

私の質問は次のとおりです：角型だけを使ってこのフォームを行う方法はありますか？

私はformlyのドキュメントを読んでいて、このフォームのような動的なモデルを作成する方法、つまり購入のアイテムの可変長配列を作成する方法を考え出さなかったので、またはそれがすべて可能である場合。あなたはこの質問に答えるために私を与えることができます任意の手掛かりを事前に

感謝:)

次のようにフォームのコードは次のとおりです。

(function(){ 
    var app = angular.module('test', []); 
})();

htmlページ：

<!DOCTYPE html> 
    <html> 

    <head> 
     <link type="text/css" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.css"/> 
     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.js"></script> 
     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.js"></script> 
     <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.5/angular.js"></script> 
     <script src="inab.js"></script> 
     <script src="PurchaseCtrl.js"></script> 
    </head> 

    <body ng-app="test"> 
     <div ng-controller="PurchaseCtrl" class="col-md-4"> 
      <h2>Purchase</h2> 
      <div class="panel panel-default"> 

       <div class="panel-heading">Title</div> 

       <div class="panel-body"> 

       <div class="form-group"> 
        <label>Store</label> 
        <select class="form-control" ng-model="model.store"> 

        <option ng-repeat="store in stores" value="{{store.id}}">{{store.name}}</option> 
        </select> 
       </div> 

       <div class="form-group"> 
        <label>date-time</label> 
        <input class="form-control" type="text" ng-model="model.datetime"/> 
       </div> 

       <div ng-repeat="item in items"> 
        <div class="form-group"> 
        <div class="col-sm-2"> 
         <label>{{item.label}}</label> 
        </div> 
        <div class="col-sm-8"> 
         <input class="form-control" type="text" ng-model="item.nome" /> 
        </div> 
        <div class="col-sm-2"> 
         <button type="submit" class="btn btn-alert submit-button col-md-2" ng-click="removeItem()">remove item</button> 
        </div> 
        </div> 
       </div> 

       <button ng-click="addItem()">Add item</button> 
       </div> 
      </div> 
      <button type="submit" class="btn btn-primary submit-button" ng-click="onSubmit()">Submit</button> 
      <pre>{{model | json}}</pre> 
      </div> 
    </body> 

    </html>

コントローラ：

(function(){ 
    angular.module('test').controller('PurchaseCtrl', ['$scope', function(scope){ 

    scope.stores = [{id: 1, name:'Store 1'}, {id: 2, name: 'Store 2'}]; 

    scope.items = []; 

    scope.datetime = ''; 

    scope.store = ''; 

    var i = 0; 

    scope.model = { 
     store: scope.store, 
     datetime: scope.datetime, 
     items: scope.items 
    }; 

    scope.addItem = function(){ 
     scope.items.push({label: 'algo' + (i++), nome:''}); 
    } 

    scope.removeItem = function(){ 
     scope.items.splice(scope.items.length - 1); 
    } 

    scope.onSubmit = function(){ 
     console.log(scope.model); 
    } 
    }]); 
})();

出典

2016-04-17 Jose Ramirez

はい、それは可能です。私は同様のものを作成しました。あなたは角型でセクションを繰り返す必要があります。[リンク]（http://angular-formly.com/#/example/advanced /繰り返しセクション） –