使用Angular JS中的ng-repeat更改基于json的输入框类型

时间:2015-08-07 06:18:31

标签: json angularjs forms

我想使用angular JS创建一个数据驱动的表单。

我能够执行ng-repeat并遍历每个标题的JSON字段,并在其中包含一个输入框。

但是现在我需要为不同的字段设置不同的文本框类型(也可以从JSON传入。例如'input'或'textarea'

<div>
    <div ng-repeat="x in form">
        <h4>{{x.field_name}}</h4>
        <input class="form-control" placeholder="{{x.field_name}}" ng-model="result[x.field_name]">
    </div>
</div>

我希望能够根据传入的JSON更改标记。

我尝试过使用

<x.field_ui_type 

我也试过

<{{x.field_ui_type}}

但它们似乎都不起作用

1 个答案:

答案 0 :(得分:1)

试试这样:

<div ng-repeat="x in form">
    <h4>{{x.field_name}}</h4>
    <div ng-switch on="x.field_ui_type">
        <textarea ng-switch-when="textarea" ng-model="result[x.field_name]"></textarea>
        <input type="textbox" ng-switch-when="input" ng-model="result[x.field_name]" />
    </div>
</div>