Angular
rust angular 自签名证书 wss
项目中采用 wss 来建立的前后端连接, 但是并没有用到认证的证书, 所以自己用 openssl 生成了私钥, 自签名证书来使用: 这里就不再赘述 Wss 连接过程, 直接上手操作: 1. 生成私钥, 证书: 请查看合集 "开发工具" => 使用 openssl 生成证书 (如果不会安装请查看合集 ......
Angular | 项目配置（angular.json、envrionment、proxy、tailwind）（三）
1.angular.json 和 package.json 配置部分详解 angular.json 是angular 项目的一些默认的配置，包括不限于运行命令、打包配置、unit test 配置 package.json 是node 项目的npm 包管理文件，但其中会涉及到一些angualr ......
Angular 17+ 高级教程 – Component 组件 の ng-template
前言 Angular 的动态组件博大精深, 没有认真学一下的话, 在开发中经常会掉坑里. 所以这篇大家要认真看一下哦. 参考 angular2 学习笔记 ( Dynamic Component 动态组件) 早年我写的文章 Angular 学习笔记 (动态组件 & Material Overlay & ......
【Angular】在vscode中，某些库接口，如SimpleChanges，没有导入，鼠标移上去，ts语言功能没有快速修复选项，如何能够恢复快速修复功能？
It appears that until recently (before TypeScript 4 release) the only way to make auto-imports work was to import each library you need at least once ......
Angular | Ngmodule （二）
@NgModule({ declarations: [], //属于当前模块的组件、指令及管道 imports: [], //当前模板所依赖的项，即外部模块（包括httpModule、路由等） export:[],//声明出应用给其他的module使用 providers: [], //注入服务到当 ......
Angular | standalone Component （一）
指导链接：angular-Standalone-guide 1.概述：standalone 时在angular 14版本引入的特性，作用是可以让组件、指令和管道独立。以后就可以独立的直接被引入其他组件，而不依赖 ngmodule 来引入，也可以在路由中实现组件的懒加载。 1.1定义一个standal ......
Angular 17+ 高级教程 – Component 组件 の Query Elements
前言 Angular 是 MVVM 框架。 MVVM 的宗旨是 "不要直接操作 DOM"。 在 Component 组件 の Template Binding Syntax 文章中，我们列举了一些常见的 DOM Manipulation。 const element = document.query ......
升级angular项目版本
1.创建新项目-angular-cli 的升级 1.1 装载指定版本的(未安装angular-cli) npm install -g @angualr/cli@version 1.2 已经安装angular-cli版本 npm uninstall -g @angular/cli //先卸载老 ......
【Angular】Angular中按顺序执行路由守卫的一种新方式
翻译自：A New Way Of Ordering Guards In Angular 概览 在Angular发布了“函数化守卫和解析器（functional guards and resolvers）”的新特性后，我们能够很容易地实现按顺序执行路由守卫，而不是像之前那样一次执行所有的路由守卫。 在 ......
Angular 应用里异步打开对话框的技术实现
const dialog = this.launchDialogService.openDialog(); dialog.pipe(take(1)).subscribe(); 这段代码涉及到 Angular 中处理对话框（Dialog）的逻辑，其中 openDialog 方法返回一个 Observa ......
如何在 Angular 应用中发起 HTTP 302 redirect
代码如下： import { RESPONSE } from '@nguniversal/express-engine/tokens' import { Response } from 'express' ... constructor(protected @Optional() @Inject(R ......
2023最新中级难度Angular面试题,包含答案。刷题必备！记录一下。
好记性不如烂笔头 内容来自 面试宝典-中级难度Angular面试题合集 问: Angular是什么？请简要介绍一下Angular框架的特点和优势。 Angular是一个由Google维护的开源前端框架，用于构建高效、动态和响应式的单页面Web应用程序。它最初在2010年作为AngularJS发布，并 ......
2023最新高级难度Angular面试题,包含答案。刷题必备！记录一下。
好记性不如烂笔头 内容来自 面试宝典-高级难度Angular面试题合集 问: 解释一下Angular中的变化检测（Change Detection）是如何工作的？请介绍Angular的默认变化检测策略以及如何优化变化检测性能。 Angular 中的变化检测（Change Detection）是一个自 ......
谈谈企业级 Angular 应用的二次开发 - 基于 Angular Component 替换的 Extensibility 支持案例介绍
我们知道面向个人用户(to Customer, 简称 2C)软件和面向企业级用户(to Business, 简称 2B)的软件，在设计和实现上都存在一些区别，比如个人软件通常注重直观的用户界面和简单易用的设计，其中用户体验是关键，因为个人软件的目标是满足个人用户的需求和偏好。想想我们每天都在刷的抖音 ......
Skeleton Design 理念在 Angular 应用开发中的具体应用一例
Skeleton Design 这个概念，想必前端开发人员比较熟悉，而普通的 App 用户，可能甚至都没有听说过，但实际上我们每个人，每天几乎都会受益于这个设计理念。 Skeleton Design 在一些国内技术社区的技术博客里，通常被称为骨架屏设计，是一种用户界面设计策略。骨架屏设计不是一种具体 ......
Angular Component 内 set 关键字的使用
"set" 关键字在Angular组件的TypeScript代码中通常用于创建和定义类的属性的setter方法。它是一种特殊的方法，负责设置类的私有成员变量的值。通过使用"set"关键字，我们可以在设置属性值时执行一些额外的逻辑，如输入验证、触发事件等。 让我们通过一个简单的例子来说明"set"关键 ......
Angular Renderer2 的作用和使用场景介绍
下图将 css class cx-icon 添加到 host dom 上。 最后效果如下： 使用的 renderer 来自： import { Component, ElementRef, HostBinding, Input, Renderer2, } from '@angular/core'; ......
Angular Input 注解在 Spartacus 项目开发中的实际应用场景一例
@Input() 装饰器是 Angular 中用于在组件中接收父组件传递的数据的一种方式。它的作用是将一个属性标记为输入属性，使得父组件可以将数据绑定到子组件的这些属性上。这样，父子组件之间就可以实现双向数据传递，实现更灵活的组件通信。 下面是一个实际的例子： SearchBoxComponent ......
使用Angular创建组件，并发布到npm上
1.组件准备工作 1.先新建一个组件库项目 ng new angular-npm-demo 2.新建一个存放组件库的目录 ng g library demo --prefix=demo; 3.进入 projects/demo/src/lib目录下新建一个组件，我的组件名叫做list-page ng ......
Angular 获取FormControl对象中获取字段名
关键代码 var formGroup = this.validateForm.controls; //control :FormControl var controlName = Object.keys(formGroup).find(name => control formGroup[name]) ......
Angular velocity formulas
This angular velocity calculator uses two different angular velocity formulas depending on your input parameters. The first angular velocity equation ......
Angular - 生命周期钩子
Angular 会按以下顺序执行钩子方法。可以用它来执行以下类型的操作。 钩子方法用途时机 ngOnChanges() 当 Angular 设置或重新设置数据绑定的输入属性时响应。 该方法接受当前和上一属性值的 SimpleChanges 对象注意，这发生的非常频繁，所以你在这里执行的任何操作都会显 ......
通过项目中的实际例子，介绍 LocalStorage 在 Angular 开发中的使用场景
笔者之前在掘金社区的技术文章，介绍过自己项目组中负责开发的一款基于 Angular 的电商 SDK： Angular 应用支持 PWA(Progressive Web Application) 特性的开发步骤分享 Angular 应用的搜索引擎优化(SEO)实战指南 本文笔者会分享自己项目过程中，在 ......
什么是 Angular 基于 Constructor Parameter 的 Dependency Injection
在 Angular 中，依赖注入（Dependency Injection, DI）是一种设计模式，用于处理如何在不同的代码部分创建和传递依赖对象。在 Angular 中，我们通常依赖于 TypeScript 的特性，如构造函数参数（constructor parameters）来执行依赖注入。 构 ......
Angular 使用 Constructor Parameters 进行依赖注入的优缺点
构造函数参数（Constructor Parameters）在Angular中是一种进行依赖注入（Dependency Injection）的重要方式之一。依赖注入是一种设计模式，通过该模式，一个类的依赖关系不是在类内部直接创建，而是通过外部提供这些依赖关系。在Angular中，依赖注入通过注入器（ ......
Angular 依赖注入领域里 optional constructor parameters 的概念介绍
Angular 依赖注入（DI）是一个强大且灵活的设计模式，它可以帮助我们更好地管理和组织我们的代码。构造函数参数的可选性（Optional）是 Angular DI 系统的一个重要特性。这种特性允许我们将某些服务或值作为可选依赖注入到组件或服务中，这样，如果这些服务或值不存在，我们的代码仍然可以正 ......
angular入门
双向绑定： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Doc ......
Angular 依赖注入系统里 Injection token PLATFORM_ID 的使用场景
Angular 的依赖注入系统是它的核心特性之一，它使得我们可以轻松地在应用程序的各个部分共享和管理代码。在 Angular 的依赖注入系统中，InjectionToken 是一个特别重要的概念。InjectionToken 是一个用于参数类型的标记类，它可以用来在依赖注入器中注入特定的值。在这里， ......
Angular 两种依赖注入的实现方法介绍
方法1：使用 Constructor parameter @Injectable(...) export class Service { constructor( protected serviceA: ServiceA, protected serviceB: ServiceB, @Inject( ......
关于指定 Angular CLI 使用的包管理器
首先，让我们解析一下这个命令：ng config -g cli.packageManager npm。这是一个 Angular CLI 的命令，主要用于设置或读取 Angular CLI 的配置。 ng 是 Angular CLI 的命令行接口，可以用来执行各种操作，包括创建新的 Angular 项 ......