Angular，Angular CLI笔记

2 年 ago
清, 扬
1 minute

对于完全不懂前端（HTML/CSS/JavaScript）的人来说，Angular CLI就是救世主。不需要了解webpack的配置等等。只需要关注npm、Angular和TypeScript就可以了。

安装Angular CLI后，将能够使用ng命令。通过ng命令可以创建项目模板，以及添加组件、服务、管道等，能够按照一定的规范进行开发。

Angular (角度/角)。

    • 公式ドキュメント

 

    • https://angular.io/docs/ts/latest/

 

    • Start Angular

 

    • 日本語。最初に読みたい。

 

    • ng-book 2

 

    • 英語。有料。Angular 4対応

 

    • The Ultimate Angular CLI Reference Guide

 

    • Angular Update Guide

 

    ANGULAR MODEL PATTERN

TypeScript 是一种编程语言

    • これはベターECMAScript2015/2016で、あまり期待しないこと。

 

    静的型付けはTypeScript内だけ有効で、外から入ってくる値には無力である。input,formやJSON等からの値は暗黙に変換されることは無く実質anyなので気を付けよう。

性能调优

    • Angular 2 Performance Checklist

 

    • 日本語訳：Angular 2 Change Detection Explained

 

    • Angular2 AoTコンパイルでTechFeedを高速化した話

 

    バンドルサイズの削減についても。

第三方库

    • バリデーター

 

    • ng2-validation

 

    • バージョン3.1.2からAoTコンパイル対応。

 

    • ng2-page-scroll

 

    指定位置へのスクロール

用户界面组件 (Uì

    • PrimeNG

 

    • 充実。

 

    • Onsen UI 2

 

    • ReactやVue.js等にも対応。日本語ドキュメントあり。

 

    • Teradata UI Platform

 

    • マテリアルデザイン。

 

    NG-LIGHTNING

我的备忘录(Memo)

    • angular-cliプロジェクトにJavaScriptライブラリを組み込む方法

 

    • angular-cliプロジェクトでng testのカバレッジを取得

 

    • ng test –code-coverage=true

 

    • 以前から使えたが、angular-cli@v1.0.0-beta.23でREADMEにcode-coverageの記述が追加された。

 

    • Angular2アプリに設定config.jsonを持たせる

 

    • Angular2アプリのURLを#付きスタイルに変更する

 

    • マルチテナント対応というかドキュメントルートではなくサブディレクトリにデプロイする（angular-cli@v1.0.0-beta.21）

 

    • Set base href dynamically – Angular 2 – Stack Overflow等ではAPP_BASE_HREFをいじくれとあるが、単純にindex.htmlのbase要素を配置ディレクトリに合わせると良い。例えば とする。件のStack Overflowの質問者のは href=”/subdir” と/で終わらないのがダメなのではないか。

 

    • Angular CLIでテンプレートのコードがAoTコンパイル通らないケース

 

    テンプレートでstring型変数の頭に+を付けてnumberに変換するコードを書くとエラー出まくる。

他参考的页面

    • Angular 2アンチパターン集

 

    • Angular2のLifecycle Hooksを理解する

 

    • Angular2のDIを知る

 

    • The Ultimate Guide to Forms in Angular 2

 

    • Walts – Angular 2向けFluxライブラリを作った

 

    Angular AoTガイド
bannerAds