iT邦幫忙

angular相關文章
共有 686 則文章
鐵人賽 Modern Web DAY 18
玩轉 Storybook 系列 第 18

技術 玩轉 Storybook: Day 18 Automated Visual Testing

視覺回溯測試 做視覺回溯測試的目的是要檢查每次修改元件UI的變化,當專案越來越大時,或是接近上線時期,修改元件的部分,有時會影響到整個專案。人工去檢視一定會有疏...

技術 Angular#3 資料結構 (可略過)

Angular [目標] 了解 Angular資料結構 .Component 元件 安裝 ng generate component [compon...

鐵人賽 Modern Web DAY 18
angular專案開發指南 系列 第 18

技術 Angular 組件間資料的傳遞方式

前言 所有前端框架都會遇到一個共同的問題,就是資料與狀態如何在組件之間傳遞,根據元件之間不同的組合關係,大致可分類為父子,兄弟與沒有關係,在 Angular 中...

技術 將網路download的靜態網頁轉型成Angular應用程式

下載版型 確認網頁是否能順利執行,個人使用lite-server。 建立Angular專案。 進入專案的index.html,<head&...

鐵人賽 自我挑戰組 DAY 16

技術 Angular建立專案(一)(Day16)

今日我們來利用Angular CLI建立一個新的專案 來打開VsCode內建的terminal 幫我移動到欲放置專案的路徑 cd {專案路徑} Angul...

鐵人賽 Modern Web DAY 13

技術 [DAY-13] Angular的路由(Router)-管理與切換頁面的好幫手

到目前為止,我們所做的一切內容,都是做在首頁。現在要來做更多頁面來顯示英雄的細節資料 事前準備 在開始之前,先修改一下原本的英雄資料,多一個descriptio...

鐵人賽 Modern Web DAY 17
angular專案開發指南 系列 第 17

技術 Angular 專業圖表套件 - Ngx-Echarts

前言 回到網站的首頁,為了量化租戶管理的效能,通常會將資料數據透過圖表的方式呈現,在網路上可以找到許多套件與 Angular 搭配完成各種任務,今天要跟大家介紹...

技術 Preview Angular taiwan 2018 conference note

明天一大早,以公假狀態,要坐車北上去聽台灣首屆 Angular conference~今晚針對議程的關鍵字去做預習!! How Reactive Program...

鐵人賽 Modern Web DAY 8

技術 [高效 Coding 術:Angular Schematics 實戰三十天] Day07 - 如何測試使用範本的 Schematic

上次跟大家分享了寫測試的好處與如何撰寫測試之後,大家有自己試著寫寫看嗎?今天要來調整上次所寫的測試程式碼,令它能夠測試我們昨天所撰寫的程式。 先來看一下昨天最終...

鐵人賽 自我挑戰組 DAY 3

技術 Day 03:不用三分鐘,建立第一個 Angular 專案範本

接下來,我們就要來建立第一個專案範本。 首先,我們可以在桌面上先建一個資料夾,命名叫 Angular,記住不要使用中文字命名,以免發生錯誤。 接著打開...

鐵人賽 自我挑戰組 DAY 29

技術 Day 29:開始來學資料繫結:使用目前所學,來個簡單實作吧!(三)

我們前一篇,雖然有將需求二實作出來,但是看到 keyCode 已被淘汰的訊息,還是覺得有點不痛快。 上網搜尋了一下,找到一篇其他開發者分享的文章: [從 0 開...

鐵人賽 Modern Web DAY 16
玩轉 Storybook 系列 第 16

技術 玩轉 Storybook: Day 16 Addons - Viewport/Accessibility

Viewport https://storybook.js.org/docs/vue/essentials/viewport Viewport 也是預設安裝好的...

技術 【課程推薦】2021/3/6~3/7 Angular前端開發框架實戰

課程目標‧ 了解Angular前端開發框架與其優勢‧ 學會有效率的利用Angular開發前端網頁應用程式‧ 掌握開發Angular的重要觀念與開發技巧 詳細資訊...

技術 面向前端的CDN解決方案! 全框架皆可使用

面向前端的CDN解決方案! 前陣子想在Angular的專案下套用CDN機制過去我都是使用 webpack publicPath 來達成但使用Angular我不...

鐵人賽 Modern Web DAY 30

技術 [Angular] Day30. Angular Module(一)

在 Angular 中應用程式是模塊化的,Angular 有自己的模塊化系統稱為 NgModule,他可以包含 component、service provid...

技術 [Angular] Forms - Control Value Accessor [上]

前言 在前兩篇的介紹中我們了解到了什麼是Angular中的form,並且對Reactive form進行了實作,不過當我們在開發專案的時候,由於form的cod...

鐵人賽 Modern Web DAY 12
angular專案開發指南 系列 第 12

技術 製作 Angular Http 通訊服務

前言 大多數前端應用都要透過 HTTP 協議與伺服器通訊,才能下載或上傳資料並訪問其它後端服務。Angular 給應用提供了一個簡化的 HTTP 客戶端 API...

鐵人賽 Modern Web DAY 12
用Angular打造完整後台 系列 第 12

技術 day12 CoreComponent

簡述 在確認此使用者的相關資訊後會進入核心模塊,也是佈局畫面的底。很多功能模塊會以延遲子路由的方式,掛在核心模塊裡。 畫面結構 <!--core.com...

鐵人賽 Modern Web DAY 7
Angular初期筆記 系列 第 7

技術 DAY7-Angular6之「IT狗的生活」開演/@NgModule項目

前情提要 DAY6-Angular6之假如app是舞台劇/@Component項目 開演啦! 在沒有 routing 的狀況下 以下就可以演好一齣戲了,僅讓 I...

鐵人賽 Modern Web DAY 7

技術 DAY7 - 安裝 bootstrap

上一篇提到 Nebular 的其中一個缺點就是 沒有格線系統 ,需要另外安裝套件或是自行設計。 這是一個缺點,但並非致命的缺點,不可克服或解決。 以下是兩個解決...

鐵人賽 Modern Web DAY 24

技術 [Day24] 第一個 Angular App

好的,今天開始我們就要用牛刀來殺雞。首先第一件事當然就是先準備牛刀,不過這個牛刀整支都在 npm 上,所以拿牛刀之前我們還需要先裝 Node.js。請直接透過傳...

鐵人賽 Modern Web DAY 29

技術 [高效 Coding 術:Angular Schematics 實戰三十天] Day28 - Angular Schematics API List (五)

介紹完引入路徑在 @schematics/angular/utility 底下的 API 之後,接下來要介紹給大家的 API 是引入路徑在 @angular-d...

技術 將Angular7 App佈署至GitHub Pages - Part2

相較於Part1只佈署dist資料夾,這次要說明如何佈署整個Angular專案。 執行npm i angular-cli-ghpages安裝angular-...

鐵人賽 Modern Web DAY 17
Angular 8 從推坑到放棄 系列 第 17

技術 [Day 16] 了解 相依注入 Service

了解 相依注入 Service 有時我們需要再多個components共享資料,例如上圖的 Applcation 架構中,想要共用LogService 以及U...

鐵人賽 Modern Web DAY 21
Angular 8 從推坑到放棄 系列 第 21

技術 [Day 20] Angular 使用 React Form

如有需要動態驗證、動態產生表單和比較複雜類型的表單狀況,使用 Reactive Form 處理應當會比 Template-Drive Form 好解決. 匯入...

鐵人賽 Modern Web DAY 20

技術 Angular 深入淺出三十天:表單與測試 Day20 - E2E 測試實作 - 登入系統

經過這兩天的介紹,相信大家對於 Cypress 應該已經有了一定程度的理解,有沒有人已經開始用它來寫測試了呢? 今天就讓我帶著大家用 Cypress 來為我們...

鐵人賽 Modern Web DAY 9

技術 Angular 深入淺出三十天:表單與測試 Day09 - 整合測試實作 - 登入系統 by Reactive Forms

昨天幫我們用 Reactive Forms 所撰寫的登入系統寫完單元測試之後,今天則是要來為它寫整合測試。 再次幫大家複習一下整合測試的測試目標: 整合測試...

鐵人賽 Modern Web DAY 28
angular專案開發指南 系列 第 28

技術 Gitlab工作流程介紹

前言 GitLab 最初是 MIT 授權的免費開源軟體。現在則有 GitLab CE(社群版) 和 GitLab EE(企業版),而兩者的核心程式碼是相同的,但...

鐵人賽 Modern Web DAY 20
Angular 8 從推坑到放棄 系列 第 20

技術 [Day 19] 初步使用 Observable

為什麼使用rxjs RxJS是一組可以用來處理非同步、以及同步事件的一個JavaScript Library 能幫助你快速地使用像是Ajax、Server W...