2018-03-21 11:44 PM 0 6,362
近一年多來工作主軸移回後端,我在前端方面進展有限,偶爾遇到要寫 Web UI 的場合,還是要靠過去整理好的 Angular 1.x + KendoUI 共用程式庫,歷經時間與實務需求磨練過,功能完整度及穩定性良好,加上使用經驗豐富,三兩下就能拼出所需介面。雖然先前已評估好未來要轉向 Vue.js...
2016-11-08 09:39 PM 13 46,797
就用這篇鬼故事當開場吧!在 2016 年学 JavaScript 是一种什么样的体验? 這幾年 HTML5 火紅,前端開發技術發展如黃河氾濫一發不可收拾,開發框架百家齊嗚,眼花瞭亂不知如何下手就算了,更要命的是市場主流每兩年就轉一次風向,兩年前我才含淚從 Knockout 轉到 Angular...
2016-09-17 12:11 PM 2 8,576
工作環境有不少Web Farm主機,部署程式時需要將一或多個檔案同步複製到多台主機上,依上線流程需產生指令檔交給OP人員執行。這種需求用COPY、XCOPY或ROBOCOPY指令寫成批次檔是最直覺有效的做法,但以「將四個檔案複製到八台主機」為例,需寫成32條指令,沒營養又躲不掉的枯躁苦工,交給機...
2016-09-16 10:22 AM 7 37,139
Angular 2於9/13推出RC7,許多人還在懷疑該不會一直到RC18吧?說時遲那時快,Angular 2 Team忽然在兩天後中秋節這天,閃電宣佈Angular 2.0進入正式版! 身為開發老兵,近年已鮮少加入Beta、Tech Preview版先鋒部隊拓荒,習慣等正式版再認真以待,一則...
2016-08-02 07:59 AM 13 21,377
跟同事討論到下拉選單連動(最常見的經典應用是縣市、行政區下拉選單連動,選取縣市後自動換成該縣市的行政區清單),這才發現針對這門必修課,我只寫過KO版範例,沒寫過NG版,趕緊補上。 我寫了一個三層式下拉選單連動範例,在ViewModel中安排Level1、Level2、Level3三個屬性保...
2016-08-01 07:35 AM 0 6,647
很久以前就寫過Angular版的Checkbox清單,不過當時的版本有點簡陋,只能以字串陣列作為來源。我心目中的理想Checkbox清單元件,應該要像ng-options能用物件陣列當作資料來源,最好還可以切換單選模式(我知道改用Radio就能單選,但規格書不時出現註明要單選的Checkbox清...
2015-11-30 06:49 AM 2 16,318
影片 Brad Green (Google Angular開發團隊的主管) 在微軟MVP年會講了一場Angular 2(微軟的人到蘋果發表會站台,Google主管跑到微軟MVP年會做簡報,世界真奇妙 :P),完整影片前陣子放到Channel 9,雖然沒去美國參加MVP年會,基於已開始靠An...
2015-11-07 04:41 PM 0 9,978
前幾天調查KendoGrid+Angular效能變差三倍的,推測問題根源不在KendoGrid,而在於Angular建立2000個具有獨立$scope的DOM元素,本身就是重度耗用資源工作。換句話說,就算不用KendoGrid,改以ng-repeat實作產生2000個頁面元素,對效能一樣是嚴峻考...
2015-11-04 10:48 PM 8 10,346
接獲使用者反應,某個使用KendoGrid顯示大量資料的網頁,用IE檢視的話速度慢到嚇人。聞此言,馬上打開IE11測試,果真嚇得我差點閃了兩滴… 也太慢了吧! 先交代問題情境,專案使用Angular搭配Kendo UI開發,順理成章使用Kendo UI提供的Angular Directive,...
2015-10-03 07:29 AM 0 6,673
Kendo UI 支援 Angular,手上 Angular 寫的專案幾乎都用 Kendo UI 網頁控制項刻介面。在KendoGrid的欄位設定中,欄位模版也可以嵌入 Angular 語法,挺好用的,如以下的例子: 將第一欄的template設定為字串"{{dataItem.C...
2015-05-23 08:35 AM 0 7,740
裝好Protractor,就可以動手寫測試了。Protractor預設使用Jasmine,之前寫Angular單元測試時玩過,語法並不陌生,但是用慣神兵利器,遇上超過一百行的JavaScript,少了Visual Studio + TypeScript拎杯根本活不下去,啊啊啊啊~(顯示為鎚子被沒...
2015-05-22 07:56 AM 0 6,787
打算用Protractor做網頁End-to-End測試。Protractor是Angular的主流測試工具,End-to-End測試時會開啟瀏覽器連上網站模擬各種操作,以使用者角度實際驗證功能是否正常。 第一步要在開發機器Windows 8安裝node.js跟Protractor,主要參考P...
2015-04-08 07:18 AM 0 7,442
開始寫Directive之後,常面臨一個難題:Directive提供函式執行特定作業,當我們在DOM中引用Directive,如先前介紹透過Isolated Scope宣告{ callback: "&" },就可輕鬆由Directive呼叫外部Scope的Callba...
2015-04-07 08:10 AM 0 10,361
專案再遇到Angular JavaScript原本執行正常啟用壓縮(Minification)後冒出找不到nPrivder、bProvider等錯誤訊息,這是Angular Dependency Injection機制因壓縮變數更名崩壞的典型案例,但訊息詭異(nProvider、bProvide...
2015-03-25 11:34 PM 2 6,030
NG範例23-使用Directive建立自訂網頁元素介紹過好用的自訂元素。除了資料互動不高的單純DOM操作Directive,一般我們都會另建獨立Scope(Isolated Scope)避免彼此干擾。而Isolated Scope宣告時需指定{ propA: "=", pr...
2015-03-22 11:30 AM 0 8,646
對於Kendo UI AutoComplete的Client端應用,過去的印象還停留在「提供字串陣列作為資料來源」、「指定contains、startswith、endswith進行比對」、「提示項目跟帶入欄位值都來自字串陣列」、「不能限定比對吻合項目上限」,感覺不如jQuery自動完成彈性。如...