-->

Handling dynamically added form data in angularjs?

2019-09-04 16:16发布

问题:

I am working on an web app which contains form page.

mandi_detail:[{
        name: String,
        mandi_correspondent_detail:[{
            name:String,
            contact:[Number]
        }]       
    }]

this is the model of a schema, i have made a ui page, in which in mandi_detail i can add multiple mandi dynamically .

In each mandi, we have name and mandi_correspondent_detail. we can add multiple mandi_correspondent_detail dynamically.

Each mandi_correspondent_detail consist name and contact number and we can add multiple numbers by number field dynamically.

how to get the posted data in controller so that i am able to insert it in schema in mongodb.

回答1:

Your view should be build according to your controller's data. This way you'll use two way binding and everything will be up to date

Example:

In your controller

 $scope.myData=[];

 $scope.pushNew= function(){

    // build your newMandy object from the form existing in html
    // validate your form

    var newMandy={
      name: String,
      mandi_correspondent_detail:[{
         name:String,
         contact:[Number]
      }]       
    }

    $scope.myData.push(newMandy);
 }

In your view

<div ng-repeat="data in myData">
    // your html structure here
</div>

// form for adding new mandy
<button ng-click="pushNew()">Add mandy details</button>

This way you can use myData array to store everything in your DB