OStack程序员社区-中国程序员成长平台

标题: javascript - 从 Wikipedia 检索数据并使用 angularjs 显示它 [打印本页]

作者: 菜鸟教程小白    时间: 2022-12-5 23:05
标题: javascript - 从 Wikipedia 检索数据并使用 angularjs 显示它

我是 angularjs 的新手。我正在尝试从维基百科获取数据并将其显示在前端。 我使用以下 php 代码从 wiki 检索数据

$url = 'http://en.wikipedia.org/w/api.php?action=query&prop=extracts|info&exintro&titles=Sachin_Tendulkar&format=json&explaintext&redirects&inprop=url&indexpageids';
$json = file_get_contents($url);
echo json_encode($json);

以下是我的控制者

var demoApp = angular.module('demoApp',['ngRoute']);
demoApp.controller('SimpleController',function ($scope,$http){
    $http.post('server/view1.php').success(function(data){
        $scope.info = data;
    });
});

我的html如下

<html ng-app="demoApp">
<head>
    <title> AngularJS Sample</title>
    <script type="text/javascript" src="js/angular.min.js"></script>
    <script type="text/javascript" src="js/angular-route.min.js"></script>
    <script type="text/javascript" src="js/script.js"></script>
    <link rel="stylesheet" type="text/css" href="css/style.css">
    <link rel="stylesheet" type="text/css" href="css/bootstrap-combined.min.css">
</head>
<body>
    <div ng-controller="SimpleController">
        {{info.query}} // I dont know if this is right
    </div>
</body>
</html>

我想显示在前端检索到的所有内容,但没有显示出来。我不知道我做错了什么。我是 angularjs 的新手。



Best Answer-推荐答案


跳过 PHP 部分并使用带有以下参数的 Angular JSONP:

format=json
callback=JSON_CALLBACK

所以 Angular 可以理解和解析 Wiki 答案:

$http({
    url: 'http://de.wikipedia.org/w/api.php?action=query&list=random&rnlimit=1&rawcontinue&format=json&callback=JSON_CALLBACK',
    method: 'jsonp'
}).success(function(response) {
    console.log(response);
    $scope.response = response;
});

这也适用于 action=parse得到一篇文章。

如果要在页面上显示原始 json 响应,请使用 json 过滤器:

<pre>{{ response | json }}</pre>

关于javascript - 从 Wikipedia 检索数据并使用 angularjs 显示它,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20069081/






欢迎光临 OStack程序员社区-中国程序员成长平台 (http://ostack.cn/) Powered by Discuz! X3.4