docker run --name miaoli -v $PWD:/var/miaoli -it -d -p 4200:4200 ubuntu docker...
昨天我們介紹了使用 *ngComponentOutlet 的方法來動態產生元件,其實它是一個使用 ViewContainerRef 來顯示不同內容的行為,因此我...
昨天我們已經順利讓 TodoListComponent 可以順利在 AppComponent 裡使用了,接下來為了方便大家練習,我們直接從 TodoMVC 的...
先備知識 EventEmitter(中文:事件發射器) 發射一個同步或非同步的自訂事件在 directives 和 components ,並註冊處理這些事件...
Emacs 對於 typescript 的設定 其實在前面寫 javascript 設定時,已經將後端 tsserver 設定完畢了,這裡只要加入 (add-h...
get node and npm basically To get this version, you can use the apt package mana...
在設計 Angular 程式時,我們很習慣的會將各種不同目標或功能的畫面拆成不同的元件,這麼一來每個元件的程式就會相對比較簡單,管理上也會更加容易,不過當樣板上...
「哈~~~~」Wayne 打了一個好大的呵欠。 「喂喂喂!打起精神來阿你!有這麼無聊嗎?!」我用手臂推了 Wayne 一下,無奈他實在是太魁武了,連晃都沒晃一下...
新增一個 component angular cli 建立 component 網址 https://github.com/angular/angular-cl...
今天我們來聊聊在 Angular 上一個有趣又方便,也是個人非常喜歡使用的語法 - <ng-container> 類型:技巧 難度:3 顆星 實用...
前言 昨日上了 Kevin 大大的 Reactive Form ,發現假如有需要動態驗證、動態產生表單和比較複雜類型的表單狀況,使用 Reactive Form...
「原來 ng serve 裡有這麼多學問阿?!真是長見識了!!那我們該如何交付我們的程式或是將我們開發出來的程式放到網路上呢?直接把整個專案資料夾放進空間裡嗎?...
昨天我們稍微提到了 <ng-template> ,並說明了可以把 <ng-template> 當作是一種樣板上等著被呼叫的方法(func...
clone久違的專案 git clone https://github.com/buddalee/miaoli.git 共用pi的資料夾 在var/miaol...
「哇賽,這 Angular CLI 還真不是普通地強大耶!!既然它這麼強大,一定還有其他好用的功能吧?!之前每次開新專案之後,Coding 前要用的 ng se...
我們都知道,在 Angular 的樣板中可以使用 *ngIf 語法來決定某段內容是否要呈現,但許多剛入門的 Angular 開發人員很少注意到其實 *ngIf...
「欸,Leo!滿好玩的耶!!雖然留言板功能很陽春,但寫起來的感覺也很簡單,不像以前寫 jQuery 的時候要寫一堆操作 DOM 的程式碼,然後弄到自己頭昏眼花的...
基礎 Template-drive Forms (中文:樣板驅動表單),裡面有四個要素,搞懂他們就可以完勝囉! form 裡面的 name [(hello)]...
「哦哦哦哦!好像又更懂一點了!!」Wayne 點了點頭說。 「有更懂一點就好,也不枉費我講的這麼辛苦。」我喝了口咖啡後說道。 「那我們可以做更複雜一點的應用了吧...
Angular 提供針對 HTML 樣板的處理,提供了很多不同的語法,今天要講一個很少看到有人使用的語法 - $any 類型:技巧 難度:3 顆星 實用度:3...
Angular 提供了一種可以很擴充元件或HTML標籤屬性的方式,叫做 directive,透過這種方式我們可以很輕易地替現有的元件或 HTML 擴充它的顯示或...
「原來 Angular 的 Template 語法跟資料綁定有這麼多名堂阿?!」Wayne 揉揉他的太陽穴,貌似有點快消化不良的樣子。 「是阿!但這一切其實都是...
說明 在傳送值的過程,有時候會需要一些其他 element 的 properties,於是就用 JS 的 docoument.get... 去抓元素,直到一天我...
昨天我們介紹了一個簡單的方法來實作 two way binding,這種方法在很多情境都非常好用,不過他還是有一些小問題,有些我們會需要在表單中使用自己設計的元...
「原來如此!這樣有比較看得懂了!基本上裝飾器就是決定類別要扮演的角色,中繼資料則是把這個角色需要的資料傳入,然後 Angular 就會幫忙把其他的事情處理好的意...
Two-way data binding with ngModel (中文:使用 ngModel 的 雙向繫結) 當開發數據輸入表單時,通常都會顯示 data...
在 Angular 中,通常我們會使用 [(ngModel)] 來實現 two way binding,這樣做基本上沒有什麼問題,但 ngModel 只能 bi...
「原來 Angular 這麼好玩啊?!」Wayne 做完練習後,開心地跟我說道。 「是不是?!之後如果寫再複雜一點的應用更能體現出 Angular 厲害的地方!...
Style binding (中文:樣式繫結) 你可以利用 style binding 設定內部 styles https://angular.io/guid...
昨天我們簡單介紹了一個模組中的 @NgModule 應該要放些什麼資料,今天我們來理解一下實務上開發 Angular 應用程式時,常見的一些模組化的方式。 類型...