отобразить файл JSON в angularjs - PullRequest
Новая
       17

отобразить файл JSON в angularjs

0 голосов
/ 20 февраля 2020

У меня есть файл json из бэкэнда, и я хочу показать его через ng-repeat. Я не знаю, как получить элемент.

В файле html я хочу сделать что-то вроде этого 

<div ng-repeat = "answer in answers">
  {{answer}}
</div>

в моем приложении. Файл js, я знаю Я получаю правильные данные, поскольку я отображал их в console.log 

socket.on('got message', function(data){
  console.log(data);
});

, но я не знаю, как преобразовать данные в ответ. данные в console.log показали следующее: если я разверну его, как я получу их в {{answer}}

 Global Quote:
    01. symbol: "MSFT"
    02. open: "186.9500"
    03. high: "187.2500"
    04. low: "185.8520"
    05. price: "186.6900"
    06. volume: "5185159"
    07. latest trading day: "2020-02-20"
    08. previous close: "187.2800"
    09. change: "-0.5900"
    10. change percent: "-0.3150%"

Мне не нужно использовать сокет, это локальный файл JSON, только если я знаю, как прочитать это в {{answer}}. 

{ "Global Quote":{
    "01. symbol":"MSFT",
    "02. open":"186.9500",
    "03. high":"187.2500",
    "04. low":"185.8520",
    "05. price":"186.2950",
    "06. volume":"5758297",
    "07. latest trading day":"2020-02-20",
    "08. previous close":"187.2800",
    "09. change":"-0.9850",
    "10. change percent":"-0.5260%"
    }
}

Но я не уверен, как передать данные из app.js в файл html. В моем файле app.js у меня есть 

 socket.on('got message', function(data){
     $scope.answers = new Array;
     $scope.answers = data;
     console.log($scope.answers);
 });

, но $scope.answers передается в файл html

Ответы [ 3 ]

1 голос
/ 21 февраля 2020

Ссылаясь на ваш комментарий к предыдущему ответу, в модели Модель, View Controller ваш $ scope.answer, написанный на контроллере, автоматически делает его доступным для соответствующего представления, более явно, html, который имеет ng-controller = "YourCtrl", все переменные будут записаны в $ scope вашего YourCtrl.

Один хороший способ отобразить json приведен в предыдущем ответе. Если вы точно не знаете структуру json, вы также можете использовать это. 

<code><pre>{{answer | json}}

Здесь json - это фильтр angular для отображения json данные.

0 голосов
/ 21 февраля 2020 
<html>
<head>
<title>My website</title>
</head>
<body>
<div ng-repeat="answer in answers">
    <p>{{answer}}</p>
</div>
</body>
</html>
0 голосов
/ 20 февраля 2020

Один из подходов: 

<div ng-repeat="(key, value) in answers['Global Quote']">
    {{key}} : {{value}}
</div>

Для получения дополнительной информации см.

ОБНОВЛЕНИЕ

AngularJS изменяет обычный поток JavaScript, предоставляя собственную обработку событий l oop. Это разбивает JavaScript на классический и AngularJS контекст выполнения. Только операции, которые применяются в контексте выполнения AngularJS, получат выгоду от AngularJS привязки данных, обработки исключений, отслеживания свойств и т. Д. c.

Вы также можете использовать $ apply () для входа в AngularJS контекст выполнения из JavaScript: 

socket.on('got message', function(data){
    $scope.$apply(function() {       
        $scope.answers = data;
        console.log($scope.answers);
    });
});

Имейте в виду, что в большинстве мест (контроллеры, службы) $ apply уже было вызвано для вас директивой, которая обрабатывает событие. Явный вызов $apply необходим только в том случае, если реализует пользовательские обратные вызовы событий, или при работе со сторонними обратными вызовами библиотек.

Для получения дополнительной информации см.

...