在AngularJs中遍历对象

Question

I want to iterate through following json and create a dynamic form,. But, both its key and value are not same. So how do I iterate it in JS?

 ["register_form", { "name":{ "fielde":"textfield", "description":"" }, "pass":{ "pass1":{ "field":"password" }, "pass2":{ "field_type":"password" } }, "mail":{ "field":"textfield", "description":"" }, "field_first_name":{ "field_type":"textfield", "description":"" } } ] 

none of these working:

 //Get the size of object = no. of fileds to be created var size = Object.keys(response[1]).length; console.log("Size..." + size); console.log("Keys.." + Object.keys(response[1])); var keys = []; var model = []; var label = []; keys.push(Object.keys(response[1])); for(var i=0;i<keys.length;i++) { angular.forEach(response[1].keys[i], function(key, value){ console.log(key + "..." + value); }); 

Answer 1

You can do it with Vanilla javascript like this:

for (key in response[1]){
console.log(key)
};

JSFiddle

Answer 2

Try This

 var jimApp = angular.module("mainApp", []); jimApp.controller('mainCtrl', function($scope, $sce){ $scope.user = {}; $scope.register_form = {"name":{ "field_type":"text", "description":"" }, "pass1":{ "field_type":"password" }, "pass2":{ "field_type":"password" }, "mail":{ "field_type":"text", "description":"" }, "field_first_name":{ "field_type":"text", "description":"" } }; $scope.formData = { name : "" }; $scope.html = ""; angular.forEach($scope.register_form, function(value, key){ $scope.html = $scope.html + "<input type="+ value.field_type +" placeholder="+key+" >"; }); $scope.trustedHtml = $sce.trustAsHtml($scope.html); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="mainApp" ng-controller="mainCtrl"> <form> <div ng-bind-html="trustedHtml"> </div> </form> </div> 

Answer 3

Updated

I think this is what you need. You can format the output whatever way you want.

 var data = { "name":{ "fielde":"textfield", "description":"" }, "pass":{ "pass1":{ "field":"password" }, "pass2":{ "field_type":"password" } }, "mail":{ "field":"textfield", "description":"" }, "field_first_name":{ "field_type":"textfield", "description":"" } }; function toArray(obj) { var result = [];var passName;var tempArray = []; for (var prop in obj) { var value = obj[prop]; if (typeof value === 'object') { $('#myForm').append("<br/><b>[[" + prop +"]]</b><br/>"); if ($.isNumeric(prop)) { passName = name + "[" + prop + "]"; } else { passName = name + "['" + prop + "']"; } tempArray = toArray(value, passName); $.each(tempArray, function (key, value) { result.push(value); }); } else { $('#myForm').append("<label>" + prop +"</label> : <span>" + obj[prop] + "</span><br/>"); result.push(name + "['" + prop + "']"); } } return result; } toArray(data); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="myForm"> </div>