gpt4 book ai didi

javascript - 如何使用angularjs在html页面上显示json数据?

转载 作者:搜寻专家 更新时间:2023-11-01 04:31:39 27 4
gpt4 key购买 nike

我正在尝试创建一个小 Angular ,它采用 json 文件并将数据显示在 html 页面上。但是我收到以下错误:POST bookmarks/data/bookmarks.json 405 (Method Not Allowed)。

这是我的代码:

<html lang="en" ng-app="bookmarksApp" id="ng-app">
<head>
<link rel="stylesheet" href="css/styles.css" />
</head>
<body ng-controller="BookmarkController as bookmarksCtrl">
<article class="main-content" role="main">
<section class="row">
<div class="content">
<div class="bookmarks-list">
<h1>Christine's Bookmarks</h1>
<ul>
<li ng-repeat="bookmark in bookmarksCtrl.bookmarks" class="">
<h3>{{bookmark.name}}</h3>
<a href="{{bookmark.url}}">{{bookmark.url}}</a>
</li>
</ul>
</div>
</div>
</section>
</article>
<script type="text/javascript" src="scripts/angular.min.js"></script>
<script type="text/javascript" src="scripts/main.js"></script>
</body>
</html>

和我的 Angular 代码:

(function() {

var app = angular.module('bookmarksApp', []);

app.controller('BookmarkController', function($scope, $http) {

$http({ method: 'POST', url: 'data/bookmarks.json' }).success(function (data) {
console.log('hello');
$scope.bookmarks = data; // response data
}).
error(function (data) {
console.log(data);
});
});

})();

有什么地方出错了吗?谢谢。

最佳答案

尝试将 POST 更改为 GET

同时修复 ng-repeat 中的问题

使用

<li ng-repeat="bookmark in bookmarks" class="">

的地方
<li ng-repeat="bookmark in bookmarksCtrl.bookmarks" class="">

关于javascript - 如何使用angularjs在html页面上显示json数据?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24552242/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com