如何使用角度从json制作视图（表单）？

我正在尝试从json创建视图。当我有对象数组时。我能够查看并validation该视图。 如果我有这个对象数组，在这种情况下我可以查看，检查plunker http://plnkr.co/edit/eD4OZ8nqETBACpSMQ7Tm?p=preview

[{ type: "email", name: "email", required:true }, { type: "text", name: "name", required:true }, { type: "number", name: "phonenumber", required:true }, { type: "checkbox", name: "whant to check" }, { type: "url", name: "server Url" }]; 

现在问题发生在我有json对象时。我需要从json对象显示视图。我不知道从哪里开始工作我有这个json

• “displayName”：显示来自输入文本字段的标签名称。
• inputValues：表示填充的tmput的类型。如果是数字，那么用户只填充数字，文本然后用户只填充数字，电子邮件然后用户填充电子邮件，如果它切换然后它是下拉给定选项。
• 如果需要字段，“必需”给出？

Answer 1

假设您的JSON来自配置文件或服务，您可以从获取JSON作为JSON对象开始：

 angular.module('myapp', []) .controller('MyController', ['$scope', function($scope) { $scope.outputs = {}; $scope.rawInput = JSON.parse( '{"studentName": "abc", \ "input": {\ "loginUser": {\ "displayDetail": "UserId for login.",\ "displayName": "Login User Id*",\ "inputType": "TEXT",\ 

（我必须转义返回以允许解析漂亮的打印JSON字符串）

一旦你拥有了，你几乎就在那里。 现在，您只需要获得所需的JSON级别并构建inputs数组：

 $scope.formInputs = $scope.rawInput['input']; $scope.inputs = []; angular.forEach($scope.formInputs, function(value, key) { /* do something for all key: value pairs */ $scope.inputs.push({"type":value.inputType.toLowerCase(),"name":value.name,"required": value.required}) }); 

请注意，您可能应该在此处执行一些错误检查 – 出于本示例的目的，我不使用任何错误。 这是一个演示此代码的工作plnkr。

我还没有全部工作 – 你必须构建你的选择或单选按钮输入，但我认为你应该能够从这里开始。

编辑我已经注明了plnkr将其公之于众