iT邦幫忙

鐵人檔案

2024 iThome 鐵人賽
回列表
自我挑戰組

Angular 元件煉成練習計畫 系列

希望不是只有複製貼上

手尻元件的練習

signal base 語法
RxJs 深入使用

參賽天數 12 天 | 共 12 篇文章 | 0 人訂閱 訂閱系列文 RSS系列文
DAY 1

元件:按鈕 - 顏色主題色控制

菜雞作者發現directive 沒處理好 bug 還沒修 按鈕 以往慣性使用Angular Material Button常常在使用時沒有考慮到太多情境這裡希望...

2024-09-15 ‧ 由 yuie2322 分享
DAY 2

button / debounce

紀錄一下按鈕自訂元件處理事後 signal 練習 fromEvent 基本元件 export class ButtonDebounceComponent i...

2024-09-16 ‧ 由 yuie2322 分享
DAY 3

Dialog / 模板插入

搞一個可以共用的的彈窗模板先弄個Materila Dialog 底 //DialogComponent <h3 mat-dialog-title&gt...

2024-09-17 ‧ 由 yuie2322 分享
DAY 4

在material accordion 在外掛一個收合功能

每天都會發現bug 先弄一個手風琴元件 <section class="bg-neutral-100"> <div c...

2024-09-18 ‧ 由 yuie2322 分享
DAY 5

螢幕寬度的廣播

構想完才發現 CDK layouts 處理了 元件內是不是符合尺寸區間的想法然後發現基本上是拉機沒有合理的使用情境糗爛 export class Day5Pag...

2024-09-19 ‧ 由 yuie2322 分享
DAY 6

line pay

卡bug 明天繼續 import { Component } from '@angular/core'; import { LinePayComponent }...

2024-09-20 ‧ 由 yuie2322 分享
DAY 7

處理一個動態元件模板

弄個按鈕按一下會新增一個component然後把邏輯抽出去一個service搞出第二顆按鈕再放個上下移動處理順序 @Component({ selector...

2024-09-21 ‧ 由 yuie2322 分享
DAY 8

ReplaySubject 當快取

import { HttpClient } from '@angular/common/http';import { Injectable } from '@a...

2024-09-22 ‧ 由 yuie2322 分享
DAY 9

倒數計時器

import { DatePipe } from '@angular/common'; import { Component, computed, effect...

2024-09-23 ‧ 由 yuie2322 分享
DAY 10

file drag

<div class="w-[400px] h-[400px] border-stone-600 border-2 border-solid...

2024-09-24 ‧ 由 yuie2322 分享