在angular-ui ui-calendar中显示WordPress JSONP博客文章标题
在angular-ui ui-calendar中显示WordPress JSONP博客文章标题
提问于 2015-04-24 05:30:51
我是angular的新手，如果这有一个显而易见的答案，我很抱歉。我希望在ui日历上显示博客文章标题及其发布日期，作为开始日期。它可以很好地处理硬编码的start、end和title值，但当我调用jsonp时，在success指令中不会返回任何内容。
如果我不使用日历，那么jsonp调用就可以正常工作，所以我认为这是一个语法问题。
这是我的angular代码(带有硬编码的日期)：
var MyController = function($scope) {
$scope.uiConfig = {
...
};
$scope.eventSources = [$scope.events];
$scope.events = [
{
start : '2015-04-20',
end : '2015-04-21',
type: "GET",
url: 'http://calendar.jacarandatech.com/wp-json/posts/5/?_jsonp=?',
dataType: 'jsonp',
success: function(response) {
//what do I put here to display the response.title??
}
}
]
};
angular
.module('MyApp', ['ui'])
.controller('MyController', MyController);
和我的html代码：
<!DOCTYPE html>
<html ng-app="MyApp">
<head>
<link rel="stylesheet" href="bower_components/fullcalendar/fullcalendar.css"/>
<script src="http://code.jquery.com/jquery-1.7.1.js"></script>
<script src="http://code.angularjs.org/1.0.1/angular-1.0.1.js" ng:autobind></script>
<script type="text/javascript" src="bower_components/angular-resource/angular-resource.js"></script>
<script src="http://www.dillingermediaonline.com/angular-ui.js"></script>
<script type="text/javascript" src="bower_components/jquery-ui/ui/jquery-ui.js"></script>
<script type="text/javascript" src="bower_components/angular-ui-calendar/src/calendar.js"></script>
<script type="text/javascript" src="bower_components/fullcalendar/fullcalendar.js"></script>
<script type="text/javascript" src="bower_components/fullcalendar/gcal.js"></script>
<script type="text/javascript" src="app.js"></script>
<title>ng calendar</title>
</head>
<body>
<div ng-controller="MyController" calendar="calendar" ui-calendar="uiConfig.calendar" ng-model="eventSources"></div>
</body>
</html>
jsonp代码(工作正常)：
$.ajax({
type: "GET",
url: 'http://calendar.jacarandatech.com/wp-json/posts/5/?_jsonp=?',
dataType: 'jsonp',
success: function (response) {
var posttitle = response.title;
var timestamp = response.modified_gmt;
console.log('post title = ' + posttitle);
console.log('timestamp = ' + timestamp);
}
});
我研究了以下堆栈溢出问题，但无法获得他们的解决方案：How do I use jsonp with angular-ui calendar
回答 1
Stack Overflow用户
发布于 2015-05-02 01:10:09
您需要确保包含标题和时间戳的变量在控制器的作用域内。
首先，在控制器的第一行添加$http，如下所示：
var MyController = function($scope, $http) {然后声明变量：
$scope.postTitle = '';
$scope.postTimestamp = '';您应该使用$http进行AJAX调用。您展示的另一个函数是不需要的。
$http.get('http://calendar.jacarandatech.com/wp-json/posts/5/?_jsonp=?').success(function (res) {
$scope.postTitle = res.title;
$scope.postTimestamp = res.modified_gmt;
});这将允许您像这样声明日历事件：
start : $scope.postTimestamp,
title : $scope.postTitle页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/29834697
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号