2016-10-14 4 views
1

Я учу AngularJS. Поэтому я просматриваю обучающие программы AngularJS здесь - https://docs.angularjs.org/tutorial/step_07. Пока я нахожусь на шаге 7, я столкнулся с синтаксической ошибкой при использовании сервиса angularjs $ http. Это моя структура каталогов приложений и файлы.

app/ 
    phone-list/phone-list.component.js 
    phone-list/phone-list.module.js 
    phone-list/phone-list.template.html 
    app.module.js 
    phonelist.php 
    phonelist.json 

телефон-лист/телефон-list.component.js

angular. 
    module('phoneList'). 
    component('phoneList', { 
    templateUrl: 'phone-list/phone-list.template.html', 
    controller: function PhoneListController($http) { 
     var self = this; 
     self.orderProp = 'age'; 

     $http.get('phonelist.json').then(function(response) { 
     console.log(response); 
     self.phones = response.data; 
     }); 
    } 
    }); 

телефон-лист/телефон-list.module.js

angular.module('phoneList', []); 

телефон-лист/телефон-лист .template.html

<p>Search: <input ng-model="$ctrl.query" /></p> 
<p> 
    <select data-ng-model="$ctrl.orderProp"> 
     <option value="name">Alphabetical</option> 
     <option value="age">Newest</option> 
    </select> 
</p> 
<ul> 
    <li data-ng-repeat="phone in $ctrl.phones | filter: $ctrl.query | orderBy: $ctrl.orderProp"> 
     <span>{{phone.name}}</span> 
     <p>{{phone.snippet}}</p> 
    </li> 
</ul> 

app.module.js

angular.module('phoneCatApp', ['phoneList']); 

phonelist.php

<!DOCTYPE html> 
<html> 
<head> 
    <title>AngularJS | Phone List</title> 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script> 
    <script type="text/javascript" src="phone-list/phone-list.module.js"></script> 
    <script type="text/javascript" src="phone-list/phone-list.component.js"></script> 
    <script type="text/javascript" src="app.module.js"></script> 
</head> 
<body data-ng-app="phoneCatApp"> 
    <phone-list></phone-list> 
</body> 
</html> 

phonelist.json

[ 
    { 
    "name": "Nexus S", 
    "snippet": "Fast just got faster with Nexus S.", 
    "age": 2, 
    }, 
    { 
    "name": "Motorola XOOM™ with Wi-Fi", 
    "snippet": "The Next, Next Generation tablet.", 
    "age": 1, 
    }, 
    { 
    "name": "MOTOROLA XOOM™", 
    "snippet": "The Next, Next Generation tablet.", 
    "age": 4 
    } 
] 

Проблема я столкнулся ниже
enter image description here

ответ

6

У вас есть дополнительные , два места, что что приводит к ошибке в json разборе

"age": 2, //<--here 
"age": 1, //<--here 

Вы должны удалить неверную , из JSON ответа & убедитесь всеми properties & strings являются обертыванием внутри " (двойных кавычек)

+0

вау супер. ты замечательный. Это решило мою проблему. –

+0

@ManikandanS Рад это знать, спасибо :) –

Смежные вопросы