Блог

Главная - Вопросы по программированию - AngularJS $ http get service ‘Ошибка синтаксиса: неожиданный токен }’ проблема

AngularJS $ http get service ‘Ошибка синтаксиса: неожиданный токен }’ проблема

#javascript #angularjs

#javascript #angularjs

Вопрос:

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

 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

phone-list/phone-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;
      });
    }
  });

phone-list/phone-list.module.js

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

phone-list/phone-list.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
  }
]

Проблема, с которой я столкнулся, приведена ниже
введите описание изображения здесь

Ответ №1:

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

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

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

Метки: