angular

Angular由一个bug说起之十九：Angular 实现可拓展 Dropdown 组件目录：项目中的 Dropdown 我公司的项目中实现过不止一个 Dropdown 组件，但是普遍存在一些难以解决的痛点。又或者在实现的时候能满足需求，但是一旦功能修改了就很难拓展。这也是写这篇文章的原因，主要是想找出一个比较好的解决方案。以下我列举一些项目中典型的问题以及它们出现的原因：

Angular 面试题及详细答案Angular 作为 Google 维护的企业级前端框架，其面试考察通常覆盖核心概念、生命周期、依赖注入、状态管理、性能优化等维度。以下整理了高频面试题及深度解析，帮助理解原理而非单纯记忆。

Angular由一个bug说起之十八：伴随框架升级而升级ESLint遇到的问题与思考伴随框架升级而升级ESLint遇到的问题与思考对于eslint这个前端事实上的代码检查工具标准，大家可能是再熟悉不过了。几乎是在编码的时时刻刻都在和它接触。在我们开发维护长达十年的项目中自然也是采用了ESLint，在从 AngularJS 一路到今天现代化的 Angular V20。为了保持项目的活力和能够利用现代化的框架特性，我们持续跟随 Angular 的版本更新。在这么长时间的版本变动中，ESLint作为项目必不可少的一部分自然也经历了许多变动。我们也遇到过一些问题自然也有一些心得，今天就在这里和

Angular进阶之十三：Angular全新控制流：革命性的模板语法升级随着Angular v17的发布，框架带来了革命性的控制流语法，彻底改变了我们编写模板的方式。这些改进不仅仅是语法糖——它们提升了性能、开发体验和代码可维护性。

Angular进阶之十二：Chrome DevTools+Angular实战诊断指南最近有一个工单是说用户在使用我们的系统的时候，如果使用某个页面的次数多了以后浏览器就开始变慢甚至卡死崩溃掉。这个问题明显是提示有内存泄露，今天就由这个问题开始分享一些关于内存泄漏的知识。

微前端MFE：(React 与 Angular)框架之间的通信方式在微前端（MFE, Micro Frontends）中使用 CustomEvent 是非常常见的，尤其是在不同子应用（Micro Apps）之间通信的时候。今天将以React 主应用 ↔ Angular 子应用之间的通信进行示例

MFE微前端高级版：Angular + Module Federation + webpack + 路由（Route way）完整示例在查看这篇文章之前，可以先简单预览一下这篇基础版的博客：MFE微前端基础版：Angular + Module Federation + webpack + 路由（Route way）完整示例 -CSDN博客

MFE微前端基础版：Angular + Module Federation + webpack + 路由（Route way）完整示例使用：RouterModule.forRoot(routes)只需导出包含所有路由配置的Module即可

Module Federation 和 Native Federation 的比较Module Federation 是 Webpack 5 引入的微前端架构方案，允许不同独立构建的应用在运行时动态共享模块。

Angular微前端架构：Module Federation + ngx-build-plus (Webpack)以下是一个完整的 Angular 微前端示例，其中使用的是 Module Federation 和 npx-build-plus 实现了主应用（Shell）与子应用（Remote）的集成。

Angular中Webpack与ngx-build-plus 浅学Webpack 是一个模块打包工具，用于将多个模块和资源打包成一个或多个文件。在 Angular 项目中，Webpack 负责将 TypeScript、HTML、CSS 等文件打包成浏览器可以理解的 JavaScript 文件。Angular CLI 默认使用 Webpack 进行项目构建，但配置是隐藏的，开发者通常不需要直接接触 Webpack 配置。

微前端 - Module Federation使用完整示例安装必要依赖：修改 webpack.config.js：主应用路由配置 (app.module.ts)：

Angular报错：cann‘t bind to ngClass since it is‘t a known property of div遇到的错误：这个错误是 Angular 中最常见的模板编译错误之一，通常出现在你试图使用 ngClass 指令，但 Angular 没有识别它的情况下。

Zhen (Evan) Wang

ABP-Book Store Application中文讲解 - Part 5: AuthorizationABP-Book Store Application中文讲解 - Part 5: Authorization

Zhen (Evan) Wang

.NET 8 + Angular WebSocket 高并发性能优化.NET 8 + Angular WebSocket 高并发性能优化。WebSocket 是一种全双工通信协议，允许客户端和服务端之间保持持久连接。在高并发场景下，优化 WebSocket 的性能至关重要。以下是针对 .NET 8 中 WebSocket 高并发性能优化的关键点：

React编程高级主题：错误处理（Error Handling）在 React + RxJS/Reactive Programming 生态中，数据流（Stream）可能会因网络错误、API 异常、数据处理失败等原因抛出错误。如果未正确处理，错误可能导致整个数据流终止，影响用户体验。

Angular由一个bug说起之十五：自定义基于Overlay的Tooltip工具提示（tooltip）是一个常见的 UI 组件，用于在用户与页面元素交互时提供额外的信息。由于angular/material/tooltip的matTooltip只能显示纯文本，所以我们可以通过自定义Directive来实现一个灵活且功能丰富的tooltip

Angular由一个bug说起之十四：SCSS @import 警告与解决⽅案在 SCSS 中，使⽤ @import 可能会产⽣以下警告：Sass 官⽅已经废弃 @import ，推荐使⽤ @use 和 @forward 进⾏模块化管理。其主要原因包括： 1. 命名冲突： @import 允许多个⽂件共享变量和混合宏，可能导致命名冲突。 2. 重复导⼊： @import 可能导致相同的⽂件被导⼊多次，影响编译性能。 3. 作⽤域问题： @import 导⼊的所有内容都是全局的，⽽ @use 采⽤更严格的作⽤域管理，避免变量污染。

angular中下载接口返回文件目录一、URL.createObjectURL()createObjectURL属于js的原生方法，位于window.URL上，用于将Blob或者File文件转换为可以临时的URL地址进行显示

Angular 中获取 DOM 节点的几种方法@ViewChild是 Angular 提供的一个装饰器，用于获取模板中某个特定的 DOM 元素或组件实例。它通常与ElementRef一起使用，以便直接操作 DOM。