如何将 WordPress 与 Angular 8 集成用于网站？

Question

我正在尝试使用以下技术创建单页网站， - Angular 版本 8+ - WordPress

我找不到很多资源来使用 Angular 8+ 在 WordPress 上工作。大多数 resources/solutions 可用的是 React 或 AngularJS。

到目前为止我所发现的仅显示了如何使用带有 /wp-json/wp/v2/posts/ 端点的服务内部的 get 方法从 WordPress 网站获取数据。但是，我正在寻找的是从头开始创建网站。

关于此的任何指南或想法都会非常有帮助。我对此有很多疑问。

如果我设置本地 Angular 环境，我将如何在 WordPress 上使用它。

Answer 1

您可以在代码中全部手动完成，也可以找到某种插件来以这种方式提供帮助。我在编码生涯中使用了这两种方法。

看看 WP-NG 是自动 bootstrap angular 应用程序的插件。通过管理页面激活模块并直接使用指令。我在 2-3 个项目中使用过它。让我说这显然取决于您的要求，您想要实现的目标。

Angular for WordPress - Free WP Plugin Library

以防万一，您仍然更喜欢代码以获得更广泛的方面。尝试这样的事情。

1) 设置 WordPress 和新主题 2）在主题中排队脚本 3）设置主题 4) 创建 AngularJS 应用程序

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

// set the configuration
myapp.run(['$rootScope', function($rootScope){
  // the following data is fetched from the JavaScript variables created by wp_localize_script(), and stored in the Angular rootScope
  $rootScope.dir = BlogInfo.url;
  $rootScope.site = BlogInfo.site;
  $rootScope.api = AppAPI.url;
}]);

// add a controller
myapp.controller('mycontroller', ['$scope', '$http', function($scope, $http) {
  // load posts from the WordPress API
  $http({
    method: 'GET',
    url: $scope.api, // derived from the rootScope
    params: {
      json: 'get_posts'
    }
  }).
  success(function(data, status, headers, config) {
    $scope.postdata = data.posts;
  }).
  error(function(data, status, headers, config) {
  });
}]);

另外，你可以看看这个博客，我前几天在知乎上看到的，很好看。是的，它适用于 Angular 6，但可以在很多方面提供帮助。 Angular 6 blog on WordPress RestAPIs

如何将 WordPress 与 Angular 8 集成用于网站？

How to integrate WordPress with Angular 8 for website?

php

rest

wordpress

content-management-system

angular