在 Angular 中绑定 JSON 数据
Posted
技术标签:
【中文标题】在 Angular 中绑定 JSON 数据【英文标题】：Binding JSON data in Angular 【发布时间】：2013-06-18 16:41:50 【问题描述】：我正在评估用于项目的 JS 框架，但我被困在 Angular 和 Ember 之间。在完成对 Angular 的评估之前，我需要知道是否有一种简单的方法可以将数据绑定到存储在 S3 上的外部 json 文件。
我的用例是使用将定期实时发布到 S3 的数据创建一个记分牌……通常每 15 秒左右一次。
现在，我只是使用本地 json 文件中的数据创建一个基本的记分牌页面，但是有没有办法让 index.html 中的数据在 json 文件更改时更新某种回调？
感谢任何帮助。谢谢！
// app.js
var App = angular.module('App', []);
App.controller('ScoreboardCtrl', function($scope, $http)
$http.get('scoreboard.json')
.then(function(res)
// Storing the json data object as 'scores'
$scope.scores = res.data;
);
);
这个想法是通过循环分数来创建一个记分牌：
<!doctype html>
<html ng-app="App" >
<head>
<meta charset="utf-8">
<title>LIVE</title>
<link rel="stylesheet" href="style.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js"></script>
<script src="app.js"></script>
</head>
<body ng-controller="ScoreboardCtrl">
<ul>
<li ng-repeat="score in scores">
score.home_team_score - score.away_team_score
</li>
</ul>
</body>
</html>
【问题讨论】：
【参考方案1】：有没有办法让 index.html 中的数据在 json 文件更改时更新
它应该已经这样做了。如果您更改$scope.scores，则视图将被更新。
如果您需要从实时服务器更新它，只需使用 setInterval（或 $timeout 服务）设置一个计时器，并定期调用 $http.get。
【讨论】：
以上是关于在 Angular 中绑定 JSON 数据的主要内容，如果未能解决你的问题，请参考以下文章
Apollo Angular Add--无法读取 tsconfig.base.json