AngularJS $http.get don`t get data from json file - html

Question

I have next code in the controller
app.controller('controller', function ($scope, $routeParams, $http) {
$http.get('db.json').success(function(data) {
$scope.phone = data;
});
});
this is JSON file:
{
"title1" : "first title",
"title2" : "second title",
"title3" : "third title",
}
and then I try to print the data like this:
<h1>{{ db.title1 }}</h1>
but in the browser I see nothing. What am I doing wrong?

Answer 1

i fixed first problem but there is another one
this is in json file
"nameArr" : [
{
"title": "title",
"image": "images/img.png"
},
{
"title": "title",
"image": "images/img1.png"
},
{
"title": "title",
"image": "images/img2.png"
},
{
"title": "title",
"image": "images/img3.png"
}
]
and ng-repeat in html like this
<div class="item" ng-repeat="items in nameArr">
<img ng-src="{{ items.image }}">
<h1>{{ items.title }}</h1>
</div>
and again don`t show nothing

Answer 2

Two things: 1) the object you reference in the template should be declared right off, not in the callback, and 2) the data coming back is going to be a string, you will need to use angular.fromJson or JSON.parse to parse it into an object.
$scope.phone = {};
app.controller('controller', function ($scope, $routeParams, $http) {
$http.get('db.json').success(function(data) {
$scope.phone = angular.fromJson(data);
});
Also, in your template, you cannot get at this inside db, because you put it on phone:
<h1>{{ phone.title1 }}</h1>