在angular-ui UI日曆中顯示WordPress JSONP博客文章標題

我是新來的角，所以如果這有一個明顯的答案道歉。我想在ui日曆上顯示博客帖子標題及其發佈日期作爲開始日期。它適用於硬編碼的開始，結束和標題值，但是當我進行jsonp調用時，在成功指令中沒有任何返回結果。在angular-ui UI日曆中顯示WordPress JSONP博客文章標題

如果我不使用日曆，jsonp調用可以正常工作，所以我認爲這是一個語法問題。

這是我的角度碼（具有硬編碼的日期）：

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

Angular JSONP calling WordPress JSON REST API

來源

2015-04-23 levgm2015

您需要確保包含標題和時間戳的變量在控制器的範圍內。

首先，在第一行添加$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

來源

2015-05-01 17:10:09 spik3s

在angular-ui UI日曆中顯示WordPress JSONP博客文章標題

回答

相關問題