Angular 是什么

学完 JavaScript 核心 与 TypeScript 核心 后，Angular 提供一套 TypeScript 优先 的全栈前端框架：组件、路由、HTTP、表单、依赖注入开箱即用。CodeRoadMap platform 使用 Next.js + React；admin 使用 Vue；Angular 列入 /roadmaps/frontend 企业级 节点，面向银行、政务、大型 B 端岗位。

学习目标

• 理解 Angular「全框架」与 React/Vue「库 + 生态」的差异
• 明确 Angular 在本站 stack 中的定位
• 对照 Vue 3 核心 与 React 核心 建立概念映射

核心内容

声明式 UI

Angular 同样遵循 UI = f(state)：模板绑定数据，变更检测更新 DOM。

import { Component } from "@angular/core";

@Component({
  selector: "app-track-list",
  standalone: true,
  template: `
    <ul>
      @for (t of tracks; track t.id) {
        <li>{{ t.title }}</li>
      }
    </ul>
  `,
})
export class TrackListComponent {
  tracks = [
    { id: 1, title: "Angular 核心" },
    { id: 2, title: "TypeScript 核心" },
  ];
}

Angular vs React/Vue（速览）

	Angular	React	Vue
语言	TypeScript 默认	JS/TS	JS/TS
模板	HTML + 指令	JSX	HTML 模板
状态	Signals / RxJS	useState	ref / reactive
DI	内置	无（Context）	provide/inject
路由/HTTP	官方包	社区选型	Vue Router

生态位置

层	Angular 常见选型
框架	Angular 17+（Standalone）
CLI	@angular/cli
UI	Angular Material / NG-ZORRO
状态	Signals + RxJS / NgRx

国内 金融、电信、政企 仍有大量 Angular 存量与招聘；读懂 Angular 是路线图技能，本站实战仍以 Next.js 核心 为主。

练习

• 浏览 Angular 中文文档 首页，阅读「为何选 Angular」
• 对照 roadmap 中 Angular 节点，列出与 React track 的三处概念对应

小结

Angular = TypeScript 全框架 + DI + 官方生态。 下一课用 CLI 创建项目。