Troubleshoot issues that don't get data from a JSON file

　　　We need data rendering when we write the project, and sometimes we find that some data is not rendered on the page during the rendering process.

Solve this problem I summed up a few points

　　1, first find your own JSON file path is correct,

　　　　

Error Demonstration: $http. Get  (Index.json). Success (function (data) {                $scope. Y_box=data. Y_box;            }) Correct specification: $http. Get (' index. JSON'). Success (function (data) {                $scope. Y_box=data. Y_box;            })

　　2. To see if the data obtained from the background exists, view the method:

App.controller ('test', function ($scope, $http) {            $http. Get ('json.json'). Success (function (data) {                $scope. Y_box=data. Y_box;                Alert ('$scope. Y_box'); // Check the box to see if the data is fetched, and if it pops up undefined, then you don't get the data, please get it from the new             })        })

　　3. Check that the HTML page is bound correctly:

<!--// sometimes make such mistakes-    correct notation --    // get the H4 data in the array--

　　　4. If the array in the rendered array is rendered as an array in the current array:

JSON file:

{  "Y_box":[    {      "h4":"I am an array of 1",      "Y_boxmain":[        {"txt":"Array 1 in array 1"},        {"txt":"Array 1 in array 2"},        {"txt":"Array 1 in array 3"}      ]    },    {      "h4":"I am an array of 2",      "Y_boxmain":[        {"txt":"Array 2 in array 1"},        {"txt":"Array 2 in array 2"},        {"txt":"Array 2 in array 3"}      ]    },    {      "h4":"I am an array of 3",      "Y_boxmain":[        {"txt":"Array 3 in array 1"},        {"txt":"Array 3 in array 2"},        {"txt":"Array 3 in array 3"}      ]    }  ]}

Let's take an example to see if you're having this error:

$http. Get ('json.json'). Success (function (data) {                $scope. Y_box=data. Y_box; // Error Demonstration                $scope. Y_box1=data. Y_box. Y_boxmain; // This is not available because of data. Y_box is an array, no specific data, the system cannot judge // correct specification  //  You must obtain the specific data in the array, such as getting the data in the first array c16/> $scope. Y_box1=data. y_box[0]. Y_boxmain;                          })

The following is a complete code for rendering data:

//HTML:<! DOCTYPE html>"Mk">"en"> <meta charset="UTF-8"> <title></title> <style>        .            y_box{width:300px;            height:200px;        BORDER:1PX solid Coral; }    </style> <script src="Angular.js"></script> <script>varApp=angular.module ("Mk",[]); App.controller ('Test', function ($scope, $http) {$http.Get('Json.json'). Success (data) {$scope. Y_box=data.            Y_box; })        })    </script>"Test"><divclass="Y_box"ng-repeat="Item in Y_box"> //gets the H4 data in the array--<divclass="Y_boxmain"> <ul> <!--//gets the array ===item in the current array. Y_boxmain--><li ng-repeat="Data in item. Y_boxmain">{{Data.txt}}</li> </ul> </div></div></body>
Troubleshoot issues that don't get data from a JSON file