creating dynamic forms using ng-repeat

被刻印的时光 ゝ 提交于 2019-12-12 03:58:31

问题


Hello everyone I need to create some dynamic forms so users can configure feeds to their specification.

I have used ng-repeat to do the following:

  1. For each feed a user needs to configure a new tab is created
  2. for each property a feed has a label and input textbox is created. Markup:

    <tabset>
    <tab ng-repeat="feed in feeds" heading="{{feed.heading}}">
        <form role="form">
            <div class="row" ng-repeat="property in feed.properties">
                <div class="col-xs-6">
                    <div class="input-group">
                        <span class="input-group-addon">
                            <span>{{property.name}}</span>
                        </span>
                        <input type="text" class="form-control" value="{{property.value}}">
                    </div>       
                </div>
            </div>
        </form> 
    </tab></tabset>
    

This works just fine with the backing json that I have however I am wondering what the accepted way of capturing the data for this kind of use case, obviously I won't know how many feeds or properties each feed has so I suppose I need to bind this to an array in some way.

The question is how?


回答1:


use ng-model

<input type="text" class="form-control" ng-model="property.value">

This way the textbox is bound to property.value. angular automatically updates property.value when you change the text in the textbox. You can use it in your JS just like any other variable. That's the beauty of angular.



来源:https://stackoverflow.com/questions/32778769/creating-dynamic-forms-using-ng-repeat

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!