AngularJS displaying data from an array - angularjs

Question

I have a controller that returns an array from my django view, i am trying to display each object in a different line in my html but it just returns json.
my controller.js
mainApp.controller('hsController', function($scope, $http, $compile, $timeout, $location) {
$scope.data = {};
$scope.init = function() {
console.log("angular loaded!")
}
$scope.data.form = {
hs_search: "",
result: {},
};
$scope.data.formStyle = {
hs_search: ""
};
$scope.submitForm = function() {
//console.log($scope.data.form)
var error = 0;
if(!$scope.data.form.hs_search) {
$scope.data.formStyle.hs_search = "is_invalid";
error++;
} else {
$scope.data.formStyle.hs_search = "";
}
if(error==0) {
var jsonCall = $http({
method: 'POST',
url:'/theapp/hs-code-search',
data: $scope.data.form,
headers: {'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'}
});
jsonCall.success(function(data, status, headers, config) {
if(data.status==1) {
$scope.data.form.result = data.data
console.log($scope.data.form.result)
}
});
jsonCall.error(function(data, status, headers, config) {
if(data.status==0) {
$.growl.error({ message: data.error});
}
});
console.log($scope.data.form)
} else {
$.growl.error({ message: "Please fill the form correctly!"});
}
}
});
my html
<div class="row">
<div class="col-lg-11 col-md-11 mx-auto">
<h3>Search Result For </h3>
<div ng-repeat="chapter_code in data.form.result">
{[{chapter_code}]}
</div>
<div ng-repeat="chapter_desc in data.form.result">
{[{chapter_desc}]}
</div>
</div>
</div>
Result that am getting
What i wanted instead is just the value of each object shown.

Answer 1

Try to convert the JSON to an Object using JSON.parse() and then you can use ng-repeat
myController.js
if(data.status==1) {
$scope.data.form.result = JSON.parse(data.data);
console.log($scope.data.form.result);
// Console shall return an Object
}
HTML
<div class="row">
<div class="col-lg-11 col-md-11 mx-auto">
<h3>Search Result For </h3>
<div ng-repeat="chapterCode in data.form.result.chapter_code">
{{chapterCode}}
</div>
<div ng-repeat="chapterDesc in data.form.result.chapter_desc">
{{chapterDesc}}
</div>
</div>
</div>