Question

所以我有一个带有嵌套元素的json文件。这是我的json文件：

this.state.name

这是我用来访问json的控制器：

    [
{
    "qid": "1",
    "contester": "0",
    "answer": "0",
    "question": "What are you most likely to do after getting into an argument? ",
    "images": [
        {
            "qid": "1",
            "imageid": "AB100",
            "imgname": "doghug_q1",
            "imgpath": "Images\/Q1\/doghug_q1.jpg"
        },
        {
            "qid": "1",
            "imageid": "AB101",
            "imgname": "eq_q1.jpg",
            "imgpath": "Images\/Q1\/eat_q1.jpg"
        },
        {
            "qid": "1",
            "imageid": "AB102",
            "imgname": "headache_q1",
            "imgpath": "Images\/Q1\/headache_q1.jpg"
        },
        {
            "qid": "1",
            "imageid": "AB106",
            "imgname": "scream_q1.jpg",
            "imgpath": "Images\/Q1\/scream_q1.jpg"
        },
        {
            "qid": "1",
            "imageid": "AB107",
            "imgname": "shopping_q1",
            "imgpath": "Images\/Q1\/shopping_q1.jpg"
        },
        {
            "qid": "1",
            "imageid": "AB108",
            "imgname": "walkAlone_q1",
            "imgpath": "Images\/Q1\/walkAlone_q1.jpg"
        }
    ]
},
{
    "qid": "2",
    "contester": "0",
    "answer": "0",
    "question": "Which game would you rather play?",
    "images": [
        {
            "qid": "2",
            "imageid": "AB105",
            "imgname": "charades_q2.jpg",
            "imgpath": "Images\/Q2\/charades_q2.jpg"
        },
        {
            "qid": "2",
            "imageid": "AB109",
            "imgname": "playingCards_q2.jpg",
            "imgpath": "Images\/Q2\/playingCards_q2.jpg"
        },
        {
            "qid": "2",
            "imageid": "AB110",
            "imgname": "chess_q2",
            "imgpath": "Images\/Q2\/chess_q2.jpg"
        },
        {
            "qid": "2",
            "imageid": "AB111",
            "imgname": "twister_q2",
            "imgpath": "Images\/Q2\/twister_q2.jpg"
        }
    ]
}

然后我的html代码使用ng-repeat显示问题和每个问题列表：

   var app= angular.module('myApp', []);

   app.controller('ListCtrl', ['$scope', '$http', 
  function($scope, $http) {
    $http.get('results.json').success(function(data) {
        $scope.questions = data; // get data from json
          angular.forEach($scope.questions, function(item){
               console.log(item.images);  
           })
        });


    });

  }
]);

截至目前，我试图将json文件中的问题ID显示为列表但是输出即时获取是：

{{question.qid}}

作为我的html页面中的输出..有人可以帮助我。我不知道我做错了什么。

Answer 1

您还没有定义class Site_model extends CI_Model { public function __construct() { /* Call the Model constructor */ parent::__construct(); } function getAllGroups() { $query = $this->db->query('SELECT * FROM citys'); return $query->result(); } }所以您应该将代码的第一行更改为此并检查您的js代码上的结束标记...：

app

Answer 2

先看看你的Javascript！结束标签不正确。用这个替换你的JS：

var app = angular.module('myApp', []);

app.controller('ListCtrl', ['$scope', '$http', 
function($scope, $http) {
    $http.get('results.json').success(function(data) {
        $scope.questions = data; // get data from json
        angular.forEach($scope.questions, function(item){
            console.log(item.images);  
        })
    });
}

]);

此外，因为你从当地拉你的json值得研究："Cross origin requests are only supported for HTTP." error when loading a local file

Answer 3

完成您案件的工作代码：

<强> HTML

    <!DOCTYPE html>
<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.js"></script>
    <script src="app.js"></script>
  </head>

  <body>
    <div ng-controller="ListCtrl">
      <ul>
        <li ng-repeat="question in questions"> {{question.qid}} </li>
      </ul>
    </div>

  </body>

</html>

<强> JS

var app = angular.module('plunker',[]);

 app.controller('ListCtrl',function ($scope,$http) {
   $http.get('data.json').success(function(data) {
        $scope.questions = data; // get data from json
    });
 });

工作Plunker

它正在工作!!试一次!!

Answer 4

首先定义app

var app = angular.module('myApp', []);

然后在您的控制器上启动$scope.questions

$scope.questions = [];

此外，您可能需要使用

解析data

$scope.questions = JSON.parse(data);

Answer 5

你的代码有些遗漏。

以下是您的代码的工作示例

http://plnkr.co/edit/FvD26TYZ9v8TbgUBUzN2?p=preview

首先，

var app = angular.module('myApp', []); //variable app is missing.

其次，您提到的数据缺少关闭方括号。

使用ng-repeat工作，通过嵌套的json文件进行交互

5 个答案: