如何用angularjs获取本地JSONB文件

来源:互联网 发布:网络机顶盒浏览器下载 编辑:程序博客网 时间:2024/06/09 19:35

下面是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>

 

0 0