新增使用者UI <div class="container"> <div> <div class=...
之前有探討過 Parchment 與 Blot,而 Parchment 還有一個屬性器 (Atrributors),今天就來看一下關於 Attributor 的...
頁面中嵌入Google map 進行顯示 <div class="flex justify-content-start">...
連假第三天,終於來到最後的兩個章節,Clipboard & Syntax Highlighter Module。因為篇幅比較沒有那麼多,所以就放在一起看...
使用者密碼變更UI <p-tabPanel header="Header II"> <ng-tem...
使用者資料編輯UI <p-tabView styleClass="tabview-custom"> <...
昨天泡了溫泉,休息一下,繼續看 History module。History module 主要保存文本操作紀錄與處理與 Quill 的 undo 和 redo...
文章列表編輯功能 editArticle(article: any) { void this.router.navigate(['/article',...
提供欄位驗證確認資料是否輸入 設定表單: 使用 Template-driven Forms 來建立表單。 定義驗證規則: 使用內建驗證器,Vali...
連假的第一天,今天繼續看 Keyboard module 的 context 剩下的參數以及設定相關的介紹。 offset 當使用者的游標從開始移動到 offs...
今天來看 Keyboard module 的章節。 Keyboard module 支援特定 context 中鍵盤事件的自訂行為。Quill 使用 Keybo...
今天開始第一個內建 module 的介紹,在第六天的時候我們就已經介紹如何自訂工具列,這篇就當作複習,跟著技術文件介紹來練習體驗。 工具列模組 (Toolbar...
文章物件開發 <div class="container"> <div> <div class...
文章物件 export interface Article { IdArticle: number; Title: string; ArticleT...
明天北北基桃沒有放颱風假,大家上班注意安全。今天開始進到 Module 的章節。 Module 允許 Quill 的操作行為與功能實現客製化。有幾個官方支援的模...
今天接著看 Extension 的部分,顧名思義就是和擴充功能相關的 API 使用。 debug 提供除錯用的靜態方法,可以開啟指定層級的 log 訊息,例如:...
今天看 Quill Editor 的 Model 技術文件介紹,根據文件的描述,語意版本控制(Semantic Versioning)不適用於實驗性 API,意...
今天來看 Events 的部分,Event 的使用方式就和 JavaScript 的事件監聽一樣,透過指定的事件名稱來監聽,並執行指定的方法。 text-cha...
檔案上傳UI實作 <input type="file" class="file-input" (change)=&...
今天繼續配著烤肉和月餅來看 Editor 的部分。Editor API 比前面的操作簡單一些,主要用在判斷使用者的游標或焦點狀態,並提供啟用與禁用編輯功能。 b...
開發總結 這30天,我們從環境建置開始,逐步進入Ionic的開發世界。我們使用許多Capacitor套件和原生功能之間的溝通橋樑,學習如何建立自己的ASP.Ne...
昨天研究並練習關於套用文本的行內與區塊樣式,初步把每個 API 的使用方式都看過一遍,今天輪到編輯器選取功能相關的 API,繼續給他看下去 XD getBoun...
在【Day - 28】時,我們順利的設定好屬於自己的Icon和Splash Screen。但是Splash Screen持續時間非常的短暫,導致APP尚未完全載...
繼昨天的 Contents 相關的 API,今天來看看 Formatting 的部分。 format 根據使用者當前選擇的字串套用文字格式,回傳的 Delta...
一款具有吸引力的APP,Icon和Splash Screen已經成為APP成功的一部分。它們不僅代表著你的品牌形象,也是使用者首次打開APP時的第一印象。因此,...
今天就繼續來看 Content 相關的 API 後半段。 insertEmbed 將嵌入式內容插入編輯器,return 為更改後的 Delta 物件。sourc...
在【Day - 25】中,我們完成歷史對話的儲存,並且已預先建立了一個聊天室功能的資料表。現在,我們將使用這個資料表,來實現一個與ChatGPT左側聊天室選單相...
SQLData @Entity() export class Article { @PrimaryGeneratedColumn() IdArticle...
今天開始來細看 Quill Editor 的技術文件,看看 Quill 有哪些方法可以使用。同時也準備了範例練習,實際呼叫並觀察也許會比較有感覺。這會是一段細節...
在【Day - 25】我們成功實現了歷史對話的儲存功能,讓我們每次開啟APP都可以延續先前的對話。今天的目標是實現查看對話記錄的功能。在這之前我們已採用Shee...
iThome鐵人賽