AngularJS $http.get 不要从 json 文件中获取数据答案

【问题标题】：AngularJS $http.get don`t get data from json fileAngularJS $http.get 不要从 json 文件中获取数据
【发布时间】：2016-05-25 18:00:31
【问题描述】：

我在控制器中有下一个代码

app.controller('controller', function ($scope, $routeParams, $http) {
    $http.get('db.json').success(function(data) {
        $scope.phone = data;
    });
});

这是 JSON 文件：

{
    "title1" : "first title",
    "title2" : "second title",
    "title3" : "third title",
}

然后我尝试像这样打印数据：

<h1>{{ db.title1 }}</h1>

但在浏览器中我什么也看不到。我做错了什么？

【问题讨论】：

你不应该改用 {{ phone.title1 }} 吗？
是的，现在它的工作！非常感谢！ :)

标签： html json angularjs

【解决方案1】：

两件事：1）你在模板中引用的对象应该立即声明，而不是在回调中，2）返回的数据将是一个字符串，你需要使用angular.fromJson或JSON .parse 将其解析为一个对象。

 $scope.phone = {};
 app.controller('controller', function ($scope, $routeParams, $http) {
    $http.get('db.json').success(function(data) {
        $scope.phone = angular.fromJson(data);
    });

此外，在您的模板中，您无法在 db 中获取此内容，因为您将其放在手机上：

<h1>{{ phone.title1 }}</h1>

【讨论】：

【解决方案2】：

我解决了第一个问题，但还有另一个问题
这是在 json 文件中

"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"
    }
]

像这样在 html 中重复 ng-repeat

<div class="item" ng-repeat="items in nameArr">
    <img ng-src="{{ items.image }}">
    <h1>{{ items.title }}</h1>
</div>

再一次什么都不显示

【讨论】：