原创 常見一個npm-angular組件

創建一個angular 應用 ng new <workspace-name> --create-application=false --create-application=false 阻止默認生成一個angular項目 其實不一定要用這

原创 angular動畫(一)

https://williamjuan027.github.io/angular-animations-explorer/home 注入模塊 BrowserAnimationsModule 來個小案例 @Component({ ...

原创 讓angular表單更簡單

extend 組件的使用 公共的方法,屬性 @Component({ selector: 'app-three', templateUrl: './three.component.html', }) export class Thr

原创 ng-zorro UI源碼技巧(二)

nz-button的點擊效果 我們可以添加給自己的自定義nz-wave指令 我覺得源碼不錯, 扣過來 nz-wave-renderer.ts /** * Use of this source code is governed by an

原创 ng-zorro UI源碼技巧(一)

在Angular 中轉譯 轉移: 將代碼從一種高級語言轉換爲另一種高級語言。 編譯:將代碼從高級語言轉換爲機器級語言 每個 Angular 項目都有一個名爲tsconfig.json的文件,其中包含將 .js 文件轉換爲 .ts 文件的

原创 angular 粘合性指令

粘貼性屬性 .sticky { position: sticky; left: 0; } 至少應指定top、right、bottom 最近滾動祖先 如果要兩個屬性都靠左 .company { position: sticky

原创 angular13源碼分析(表單查缺補漏一)

FormControl maxLength(): ValidatorFn { return (control: AbstractControl): ValidationErrors | null => { //

原创 日期選擇器開始結束時間設置閾值

有個需求, 開始時間和結束時間的閾值爲兩天 想到了一個巧妙的思路, 可以同時滿足這個條件 結束時間不能小於開始時間 開始時間不能大於結束時間 <nz-date-picker [nzAllowClear]="false"

原创 p5 隨機圓連接背景和代碼樹

隨機圓連接 See the Pen p5.js有趣的圖 by 973782523 (@973782523) on CodePen. 代碼樹 See the Pen 代碼樹 by 973782523 (@9737

原创 angular技巧

withLatestFrom 將源 Observable 與其他 Observable 組合以創建一個 Observable,其值從每個 Observable 的最新值計算,僅當源發出時。 拿到最新的值進行合併 const sport

原创 angular 高級表單拆分使用

我們在寫複雜結構的表單的時候, 想的是怎麼可以更好的偷懶且代碼結構簡化易於維護 表單傳給子代執行 父 <app-time-module-four [formGroup]="validateForm"></app-time-module-

原创 rxjs 技巧

skip rxjs 忽略前兩次執行 skip(2) 星號背後的意義* <h1 *myNgIf> Angular rocks </h1> 等價 <ng-template myNgIf> <h1> Angul

原创 angular國際化 / rxjs使用技巧

設置 base href ng build --base-href "/" --prod async管道的用法 <ng-container *ngIf="num|async;let add;"> <h1>{{add}}</h1> <

原创 angular-cdk 探索

安裝(文檔參考版本12.1.1) ng add @angular/cdk 添加css @import '~@angular/cdk/overlay-prebuilt.css'; 執行兩個方法 <button (click)="add()

原创 angular 自定義表單/*ngFor增刪不更新

自定義表單項目實踐 父 <app-two [(ngModel)]="books"></app-two> books='' 子 @Component({ selector: 'app-two', templateUrl: './tw