版本声明

本教程写于 Angular v17,但往后的所有新功能,API 都有更新到相关文章里头,所以教程总是最新的,大家可以安心学习。

前言

光阴飞逝,一转眼,我尽然已经有两年多的时间完全没有接触 Angular 了。

庆幸,最近又有机会可以开始写 Angular 了。

两年,忘记了好多东西。但更令我惊讶的是,这两年 Angular 竟然突飞猛进,加了很多功能,甚至连语法也改动了不少。

本想说只要翻翻旧笔记就可以重启 Angular,天真。

看来非得来个大复习,把新知识总结进旧知识体系,这样才可以稳步前行。

那...既然都要大复习了,何不再花点力气,写个教程?

开干!

适合阅读的人

本系列特别适合以下读者:

  1. 向我一样很长时间没有接触 Angular 的人。

  2. 本来就会用 Angular,但想要深入理解 Angular 的人。

    我特意把本系列标榜为 "高级教程",就是想借此机会写点深入的内容,比如:源码解析。

  3. 有丰富前后端开发经验,且对 Angular 感兴趣,但又没有用过 Angular 的人。

    由于我是个全栈攻城狮。

    前端熟悉 HTML、Scss、TypeScript、DOM、BOM。

    后端熟悉 ASP.NET Core、SQL Server、Azure。

    因此我从不迷恋前端框架。相反我看前端框架的视角和大多数前端攻城狮有算不同,诠释也不一样。

    所以,如果你和我有相同背景,那我相信你阅读本系列会感觉特别舒服。

  4. 想从 React / Vue 转 Angular 的人。

    Angular 是出了名的难学。市场上经常可以听到谁谁谁 Angular 转 React / Vue 一个星期就上手了。

    但你很少会听到反过来的例子,更常听到的是:"Angular 太复杂了"。

    这也是为什么我想写这个系列。让一些有需求的人,可以轻松一点的深入学习 Angular。

不适合阅读的人

本系列不适合以下读者:

  1. 后端老手,前端新手。

    许多后端攻城狮想跨前端,他们会优先考虑 Angular。

    因为坊间传言,Angular 和 Java Spring 很像,甚至有人说 Angular 就是一群搞 Java 的人设计出来的。

    但其实呢,这种谣言听听就好。不管 Angular 借鉴、参考、跟从了多少其它领域的知识,它终究还是个前端框架。

    它不可能也不应该离前端技术太远,所以要深入理解 Angular,你必须先具备前端方方面面的技术。

  2. 想要研究 Angular 源码的人。

    本系列会涉及源码解析,但它不是主角,也不是二号,甚至配角都不到,挺多只能算是个小配角吧。

    所以,如果你关心的是源码,那很抱歉,这个系列并不合适你。

本系列的编辑指南

我写这个系列是有明确的标准和指南的,虽然我也不一定会达标,但至少是有定了目标的。

也希望读者借由这个指南,顺着我的写法阅读,这样就能获得最棒的阅读体验哦 。

1. 为什么要写这个教程?

我要复习,顺便写的。

顺便的标准就是不能尽心尽力,也不能为了取悦读者而花心思。

总之,怎么写比较我的意,怎么写比较方便我,那我就怎么写。

2. 写给谁看?

上面说了,适合阅读的人

3. 写的多深,写的多浅?

既然标榜是"高级教程",那肯定是要写得比官方文档更深入了。

深的部分我会分 4 个点

  1. 概念

    problems & solutions & ideas.

    你若想深入理解一套工具和方案,首先你得知道它试图想解决什么样的问题。

    其二是你得要知道它如何解决这些问题。

    最后你还得要知道这个解决方案的思路来自何方,去往何处。

  2. 最佳实践 & 自定义方案

    框架一定会有灵活度。因为它需要预备面对未知的问题。

    有灵活度才能自定义方案,才能扩展框架去解决未知的问题。

    而面对已知的问题,我们应该总是使用最佳实践。

    许多初学者因为对框架没有深入理解,经常在已知的问题上使用了自定义的方案,而在未知的问题上,卡着。

  3. 实战

    真实项目中的案例可以更好的体现框架的灵活度。

    不管学习什么技术,最终你得要 "活用"。

  4. 源码解析

    有些时候,看源码会比找文档,做测试来得更高效,更可靠。

    Angular 的源码还算整齐,而且是 TypeScript 写的。所以,必要时逛一逛源码是好的。

浅的部分,不能太浅,不然去看官方文档就好了丫。

我目前的规划是,Angular v14 以前的浅知识,我会教,但不会 step by step 的教,也不会 100% 一滴不漏的教到完。

Angular v14 以后的新语法,新功能,我则会 step by step 的教。

对于深知识,不管什么版本,我都会教到完。

4. 课纲编排

Angular 的知识体系是相互交织的。你没有办法单独拎一块出来深入理解。

当你尝试理解到一半时,你就会发现要理解这一块,你必须先理解另一块,而要理解另一块,你又必须先理解另另一块,以此类推,直到最后你甚至会发现...它竟然是个循环依赖。

所以许多教程只教基础,东西南北一起教,但每一块又教不深。

我不打算这样。我就是偏偏要拎一块出来深入讲解!

在课纲安排上,我会先教那些没有太多知识依赖,可以单独深入理解的部分,然后一块一块的将它们拼接上。

所以呢,这个教程你必须顺着目录一篇一篇的往下学,因为后面的文章一定依赖前面文章的知识。

5. 视角与诠释

我看待 Angular 是这样的:

  1. 它不是唯一的方案

  2. 它的解未必是最优的

  3. 我用它或许只是因为我懒得自己写

每当我看到一个 Angular 功能或者说一种解法时,我会先想如果我用纯 HTML、JS、CSS、DOM、BOM 该如何去解决相同的问题。

然后我会想,Angular 解法的利与弊,再想 Angular 是如何用 pure HTML、JS、CSS、DOM、BOM 去做到它的解法的,最后再学习使用它。

如果让我教一个人 Angular,我想我也会从这个角度出发吧。

总结

这篇是 Angular 高级教程系列的开篇,主要讲述:

  1. 为什么会有这个教程

  2. 教程都适合哪些读者

  3. 该怎么去阅读这个教程

目录

下一篇 Angular 18+ 高级教程 – 初识 Angular

想查看目录,请移步 Angular 18+ 高级教程 – 目录

喜欢请点推荐,若发现教程内容以新版脱节请评论通知我。happy coding

Angular 18+ 高级教程 – 关于本教程的更多相关文章

  1. 帮助你提高排版技巧的18个 PS 文字特效教程

    Photoshop 文字特效教程对于学习基础的和高级的排版思维有很大的帮助.在这篇文章中,你会发现一组最新发布的文字效果教程.这些高品质的 Photoshop 教程可以帮助你设计出惊人的2D,3D,木 ...

  2. 【vscode高级玩家】Visual Studio Code❤️安装教程(最新版🎉教程小白也能看懂!)

    目录 如果您在浏览过程中发现文章内容有误,请点此链接查看该文章的完整纯净版 下载 Linux Mac OS 安装 运行安装程序 同意使用协议 选择附加任务 准备安装 开始安装 安装完成 如果您在浏览过 ...

  3. C#游戏开发高速新手教程Unity5.5教程

    C#游戏开发高速新手教程Unity5.5教程 试读文档下载地址:http://pan.baidu.com/s/1slwBHoD C#是微软公布的高级程序设计语言.这门语言和C语言一样,已经成为了大学计 ...

  4. 推介一个学习JAVA的系列教程-狗鱼IT教程

    介绍一个学JAVA的零基础学习JAVA的网站,推介一个学习JAVA的系列教程-狗鱼IT教程 下面是java的系教程: 1、[java教程]Java 教程 2、[java教程]Java 简介 3、[ja ...

  5. Android扫盲教程大全经典教程全分享

    Android扫盲教程大全经典教程全分享,相当于android的简单用户手册下载路径 Android扫盲教程大全经典教程全分享.rar

  6. 转帖-[教程] Win7精简教程(简易中度)2016年8月-0day

    [教程] Win7精简教程(简易中度)2016年8月 0day 发表于 2016-8-19 16:08:41  https://www.itsk.com/thread-370260-1-1.html ...

  7. TensorFlow 中文资源全集,官方网站,安装教程,入门教程,实战项目,学习路径。

    Awesome-TensorFlow-Chinese TensorFlow 中文资源全集,学习路径推荐: 官方网站,初步了解. 安装教程,安装之后跑起来. 入门教程,简单的模型学习和运行. 实战项目, ...

  8. angular.js高级程序设计书本开头配置环境出错,谁能给解答一下

    server.jsvar connect=require('connect');serveStatic=require('serve-static');var app=connect();app.us ...

  9. 最全的access2013教程 access 2010教程 access 2007教程 Access 2003教程

    最全的access2013教程 access 2010教程 access 2007教程 Access 2003教程 都在这个access中国网站里 http://www.office-cn.net/o ...

  10. TensorFlow 中文资源精选,官方网站,安装教程,入门教程,实战项目,学习路径。

    Awesome-TensorFlow-Chinese TensorFlow 中文资源全集,学习路径推荐: 官方网站,初步了解. 安装教程,安装之后跑起来. 入门教程,简单的模型学习和运行. 实战项目, ...

随机推荐

  1. 创建数据库时排序规则utf8_general_ci与utf8_bin的区别

    在MySQL数据库中,字符集(如utf8)定义了字符如何存储,而排序规则(Collation)则定义了字符如何比较.排序和区分大小写.utf8_general_ci和utf8_bin是两种常用的UTF ...

  2. [oeasy]python0009 - 设置断点_break_point

    ​ 调试程序 回忆上次内容 ​py​​ 的程序是按照顺序执行的 是一行行挨排解释执行的 程序并不是数量越多越好 kpi也在不断演化 ​ 编辑 写的代码越多 出现的bug就越多 那什么是bug呢? 如何 ...

  3. ABC341

    E link 这个题目中所说的好的其实就是像\(010101\)这样一个\(0\),一个\(1\)的字符串. 那么不好的就是两个\(0\)或两个\(1\)在一起,所以判断一个区间好不好只需要判断一个区 ...

  4. 全网最好看的单细胞umap图绘制教程

    全网最好看的单细胞umap图绘制教程 作者按 大家或许都曾被Nature, Science上的单细胞umap图吸引过,不免心生崇拜.在这里,我们将介绍一种简单方便的顶刊级umap图可视化 全文字数|预 ...

  5. 嘿,我使用了mp的自连接+分页查询之后,再使用条件查询居然失效了。

    原因:我想通过自连接查询将一个表的两条数据放在一起,为此我重写了mp的分页查询 IPage<Indi> selectIndiShow(IPage<Indi> page, @Pa ...

  6. Mysql函数10-IF

    IF函数用于判断条件是否成立,成立则执行命令1,不成立则执行命令2. 1.sql查询出一列create_time select create_time from goods where id=65 2 ...

  7. Mysql函数1-IFNULL

    IFNULL函数用于判断参数值是null时则返回指定内容. 原本 select goods_base_name,goods_id from goods where goods_id in (6,7,8 ...

  8. 【Vue】单元格合并,与动态校验

    效果要求 先看需求效果: 多个数据授权项,配置的时候,业务名称大多数都是一样的,需要合并单元格处理 在elementUI组件文档中有说明[合并列行]: https://element.eleme.io ...

  9. 个人自家使用的路由器:水星D121G —— 1200M 11AC双频千兆无线路由器 D121G

    地址: https://www.mercurycom.com.cn/product-465-0.html

  10. 大语言模型可以自动生成sql语句吗?

    大语言模型的能力已经是毋庸置疑的了,随着ChatGPT的霸榜,各种语言模型的应用也多了起来,这时候突然有一个意外,那就是:大语言模型可以自动生成sql语句吗? 之所以有这个疑问,主要是因为sql正好是 ...