如何用angularjs获取本地JSONB文件

最新推荐文章于 2021-04-05 15:02:38 发布

iteye_17819

最新推荐文章于 2021-04-05 15:02:38 发布

阅读量272

点赞数

分类专栏： angularjs 文章标签： json javascript ViewUI

本文链接：https://blog.csdn.net/iteye_17819/article/details/82672388

版权

angularjs 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

下面是goods_information.json文件的内容，它包含的就是简单的JSON串：

[{"classification":"饮料","name":"可口可乐","price":"3","unit":"瓶"},
{"classification":"饮料","name":"雪碧","price":"3","unit":"瓶"},
{"classification":"水果","name":"苹果","price":"5.5","unit":"斤"},
{"classification":"水果","name":"荔枝","price":"15","unit":"斤"},
{"classification":"生活用品","name":"电池","price":"2","unit":"个"},
{"classification":"食品","name":"方便面","price":"4.5","unit":"袋"}]

注意：对象的属性名必须使用双引号

使用$http.get方法获取JSON文件

<!DOCTYPE html>
<html ng-app="myApp">
<head lang="en" >
    <meta charset="UTF-8">
    <title>demo</title>
    <script src="../js/angular.min.js"></script>
</head>
<body ng-controller="demoCtrl">
<table>
    <tr ng-repeat="item in goods_informations">
        <td>{{item.classification}}</td>
        <td>{{item.name}}</td>
        <td>{{item.price}}</td>
        <td>{{item.unit}}</td>
    </tr>
</table>
<script>
    var app=angular.module('myApp',[])
    app.controller('demoCtrl', function($scope,$http) {
        $http.get('../js/goods_information.json').success(function(data){
            $scope.goods_informations = data;
        })
    })
</script>
</body>
</html>

iteye_17819

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
如何用angularjs获取本地JSONB文件

下面是goods_information.json文件的内容，它包含的就是简单的JSON串：[{"classification":"饮料","name":"可口可乐","price":"3","unit":"瓶"},{"classification":"饮料","name":&q
复制链接

扫一扫

专栏目录