在角度（离子）上的wp rest api中获取帖子绑定到id

Posted 2023-02-19

【中文标题】在角度（离子）上的wp rest api中获取帖子绑定到id

【英文标题】：get post bind to id in wp rest api on angular(ionic)

【发布时间】：2017-05-22 09:12:41

【问题描述】：

我正在尝试使用 ionic(angular) 应用程序中的 wp-rest-api v2 从 wordpress 站点加载每个帖子，然后将此列表中的每个帖子链接到所需的帖子和页面，问题是未显示帖子 ID，因此，如果我将鼠标悬停在 posts.html 中的任何帖子上，我只会看到指向 #/app/posts/ 的链接，而不是例如 #/app/posts/4821（它是示例帖子的 id）

// in App.js I have the route for this pages 

  .state('app.posts', 
    url: '/posts',
    data :  auth : true ,
    cache : false,
    views: 
      'menuContent': 
        templateUrl: 'templates/posts.html',
        controller : 'PostsCtrl'
      
    
  )
  .state('app.postDetails', 
    url: "/postDetail/:postId",
    views: 
      'menuContent': 
        templateUrl: 'templates/postDetail.html',
        controller : 'postDetailCtrl'
      
    
  )


  //in controller.js I have the PostsCtrl 
  .controller('postDetailCtrl', function($scope, $http, $stateParams, $sce) 
    $http.get('http://example.com/wp-json/wp/v2/posts/' + $stateParams.postId).then(
      function(returnedData)
        $scope.postDetails = returnedData.data;
        console.log($scope.postDetails);
        $scope.post_title = $sce.trustAsHtml($scope.postDetails.title.rendered);
        $scope.post_content = $sce.trustAsHtml($scope.postDetails.content.rendered);

      , function(err)
        console.log(err);
      )

)

<!--This will load all the posts in posts.html template -->
<ion-item class="item item-avatar item-text-wrap" ng-repeat="recentPost in recentPosts | filter: searchText" href="#/app/posts/post.ID">      
 </ion-item>



<!-- this is the postDetails.html, template for each post--> 
   <div class="item item-avatar">
     <div class="text-right item-text-wrap" ng-bind-html="post_title"></div>
      </div>

     <div class="item item-image">
        <img ng-src="post_image">
     </div>

     <div class="item" dir="rtl">
       <p class="text-right item-text-wrap" ng-bind-html="post_content"></p>
     </div>

【问题讨论】：

您好，您是否尝试过使用 ng-href .. 或者如果您使用 ui-router ui-sref="app.postDetails(postId:post.ID)"

嗨，使用 ng-href 和 ui-sref 它返回 TypeError: Cannot read property 'rendered' of undefined

所以检查您的帖子实体中是否有属性（可能写不同）ID ..它可能是 Id 还是 id ？？

好吧，我尝试了不同的选项，例如 id 或 Id，但它们似乎都不起作用，代码与 JSON API 插件一起工作正常（http 请求路由和响应有点不同）但它不起作用使用 wp-rest-api，我认为它与此插件及其 api 回调有关，我更喜欢使用 wp-rest-api 否则我会切换到 JSON API

您不能使用 chrome 的网络选项卡嗅探请求并获取从 API 返回的 JSON，或者尝试使用 POSTMAN 发出请求并检查 JSON 的字段吗？

【参考方案1】：

您没有正确访问帖子项目，您使用的是 post.ID 而不是 recentPost.ID。我认为其他一切都很好。

应该是这样的：

<ion-item class="item item-avatar item-text-wrap" ng-repeat="recentPost in recentPosts | filter: searchText" href="#/app/posts/recentPost.ID">      

比 href 更好的是使用 ui-sref 来声明状态和参数并让 angular 构建 url。像这样：

<ion-item class="item item-avatar item-text-wrap" ng-repeat="recentPost in recentPosts | filter: searchText" ui-sref="app.postDetails(postId: recentPost.ID)">      

【讨论】：

tnx，这就是问题所在，出于某种原因我根本没有注意到它:)，现在它使用了 post id