6、使用 Angular Router 和 WordPress 构建个人博客

使用 Angular Router 和 WordPress 构建个人博客

1. 基本功能与环境配置

当我们完成基本应用结构搭建后，可通过相应链接访问不同页面。同时，借助 Angular Router 提供的 routerLinkActive 指令，能为元素动态添加类。例如，当处于主页时，主页链接会添加 active 类；处于关于页面时，关于链接会添加 active 类。

接下来，我们要创建调用 WordPress API 的服务，并配置多环境，让每个环境使用各自的 WordPress API。

由于存在用于开发和生产的两个不同 WordPress 站点，我们利用 Angular 提供的环境文件来实现这一需求。默认情况下，Angular 提供 environment.ts 和 environment.prod.ts 两个环境文件。开发时使用 environment.ts ，生产构建时，Angular 会将其替换为 environment.prod.ts 。

编辑 environment.ts 文件：

export const environment = {
    production: false,
    WORDPRESS_REST_URL: 'http://demo5683935.mockable.io/'
};
<