2017年5月22日 星期一

製作 Deepin 15.4 安裝 USB

下載 深度启动盘制作工具

只是 linux 版的 deb 我在我的桌機 ubuntu 16.04 裝不起來....


方法 1:在 windows 下使用 啟動盤製作工具 操作最簡單

方法 2:在 linux 下操作

假設 USB 隨身碟在 /dev/sdc

sudo dd if=/path/to/deepin.iso of=/dev/sdc


方法 3:解壓縮出來做成 live usb,進入 live 系統後用 啟動盤製作工具 操作

重要提醒:傳統 BIOS 製作出的隨身碟不能用在 UEFI ,要另外製作

[ 好文 ] 輕鬆理解 Ajax 與跨來源請求

輕鬆理解 Ajax 與跨來源請求 | TechBridge 技術共筆部落格

值得參考的一篇文章

2017年5月17日 星期三

運用 combineLatest 管理多個 filter,組合 Query String

Manage your Filters Like a Pro in Angular With combineLatest

文章中的例子有兩組篩選條件,任一個變更時即改變 query string 的內容

利用新增 decorator 自動退訂 Observable

🎩 Automagically Unsubscribe in Angular – NetanelBasal

利用新增 decorator 自動退訂 Observable,也可以選擇性保留某些不退訂

在 Angular 中用 directive 實作 Vue 的 event modifiers for v-on

Implementing Event Modifiers in Angular – NetanelBasal

好棒的 idea 呀....

阮一峰的 WebSocket 基礎教學

WebSocket 教程 - 阮一峰的网络日志

angular 事件綁定鍵盤按鍵列表(含組合鍵)

keydown.a
keydown.b
keydown.c
keydown.dot
keydown.Spacebar
keydown.meta.Enter
keydown.alt.Enter
keydown.control.Enter
keydown.shift.Enter
keydown.meta.o
keydown.meta.s
keydown.meta.f
keydown.escape
keydown.ArrowLeft
keydown.ArrowRight
keydown.ArrowUp
keydown.ArrowDown
keydown.0
keydown.1
keydown.2
keydown.3
keydown.4
keydown.5
keydown.6
keydown.7
keydown.8
keydown.9
keydown.tab

meta 就是 window 鍵 / Command 鍵( Mac )

參考資料:

Native Key-Combination Event-Binding Support In Angular 2 Beta 17

Understanding ViewChildren, ContentChildren, and QueryList in Angular

Understanding ViewChildren, ContentChildren, and QueryList in Angular

ViewChild
ViewChildren
ContentChild
ContentChildren
QueryList

搞不清楚這些東西嗎?來看看這篇文章吧

Dynamically Creating Components With Angular

Dynamically Creating Components With Angular – NetanelBasal

動態建立 component

相關資源:

05 Programmatically Create Components in Angular2 :: Learn Angular 4 Step by Step - YouTube

Handling Multiple Checkboxes in Angular Forms

Handling Multiple Checkboxes in Angular Forms – NetanelBasal

用 FormArray 處理多個 checkbox

RxJS Subjects for human beings

RxJS Subjects for human beings – NetanelBasal

提供的例子滿好了解的

Implementing Auth Guard with Componentless Route in Angular

Implementing Auth Guard with Componentless Route in Angular

需要做權限控管的可以參考參考

2017年5月11日 星期四

Component architecture recipes for Angular’s reactive forms

Component architecture recipes for Angular’s reactive forms

GitHub

文章中的作法值得深入思考,另外文章中有一段 code 我覺得特別有趣:

selectTopping(topping: Topping) { const index = this.control.value.indexOf(topping); if (!!~index) { this.removeTopping(index); } else { this.addTopping(topping); } }

!!~index ==> index 是 indexOf 的結果:

topping 存在陣列中的話 index >= 0,否則 index = -1
所以 !!~index 也可以寫成 index >= 0

後來實驗了一下:

!!~(-1) ==> false
!!~0     ==> true
!!~1     ==> true
!!~2     ==> true
發現了嗎? index = 0 時表示有找到,但 0 是 falsy 值,用 !! 轉換之後會是 false,這樣和 index > 0 時轉換後是不一致的,但是先用 ~ 處理過再用 !! 轉換之後就一致啦

參考資料:
JavaScript Bitwise

Javascript中的位元運算子 (1) - iT 邦幫忙::一起幫忙解決難題,拯救 IT 人的一天

2017年5月6日 星期六

preventDefault vs. stopPropagation vs. stopImmediatePropagation

preventDefault vs. stopPropagation vs. stopImmediatePropagation

解釋了三者的差異,文章舉的例子很容易懂喔

DOM 的事件傳遞機制:捕獲與冒泡 | TechBridge 技術共筆部落格 (推薦閱讀)

Termius:跨平台的 ssh client

Cross-Platform SSH Client Termius is available as a Snap app on Linux

Linux 下可以透過 snap 安裝,以下是以 Deepin 15.4 為例:

sudo apt install snapd

sudo snap install termius

json2ts - generate TypeScript interfaces from json

json2ts - generate TypeScript interfaces from json

將 json 轉成 typescript 的 interface

中文假字 plugin for sublime text

Chinese Lorem Ipsum plugin (sublime text plugin) - YouTube

ctlorem 再按 alt + c