Controller required via $stateProvider not binding data to $scope - angularjs

Question

I got a $stateProvider in my app with which i'm requiring a controller like below,
$stateProvider
.state('randomState', {
url: "/randomState",
templateUrl: "template.html",
controller: require('randomData')
});
the template.html is very simple that it has the below markup,
<simple-table data="tableData.data"></simple-table>
All i do in the controller is using the $http service, i hit an end point which provides me a JSON object and once the data is received, in the success callback i attach the $scope as $scope.tableData = data, but in the page i could see the <tr>'s getting populated but not the cells <td>, could not see any errors in the console, also when i log $scope.tableData i could see the proper object getting binded, any idea on why it is not binding the data's inside cell element.
I even tried encapsulating the $http service inside $timeout, but no luck. JSON response would look something like below,
{
"data": {
"columns": [
{"header": "Column header"},
{"header": "Column header"}
],
"data": [
[
"Row Header <br>(optional)",
"Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
"$7.50B",
"427,576,608",
"$7.50B"
],[
"Row Header",
"Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
"45.06",
"+24.54%",
"45.06"
]
]
}
}