例えば#ff0000をrgb(255,0,0)に変換したい場合。 カラーコード（文字列）を2文字ずつに分ける 16進法を10進法に変換する import compose from 'lodash/fp/compose'; import map from 'lodash/fp/map'; function hexToRgb(hex: string): string { return comp…

undefinedを使うべきかnullを使うべきか。コンテキストで使い分けるべきか。 Coding guidelines · Microsoft/TypeScript Wiki · GitHub contributors向けのガイド。undefinedを使えとのこと。 Rule: no-null-keyword TSLintにルールもある。

Event - Web APIs | MDN MouseEvent - Web APIs | MDN KeyboardEvent - Web APIs | MDN HTMLElement - Web APIs | MDN EventTarget <- Node <- Element <- HTMLElement /** * ボタンのdisabled属性を変更 */ public onMouseEvent($event: MouseEvent) { cons…

前回のスタイルガイドに続き、ドキュメント読んで気になる箇所を抜粋。 NgModules Angular modularity The root AppModule Bootstrapping in main.ts Declare directives and components Service providers Import supporting modules Application-scoped pr…

Angular公式のStyle Guideから気になった箇所を抜粋したものです。 Style GuideとNgModulesについての公式ドキュメントを読んだら、実際のアプリを作るときの大枠がある程度整理できました。 ドキュメントはそれなりに長いですが、命名規則など、Angular CLI…

これは何か 前提知識 調べたことメモ Angular CLI Autoprefixer 環境変数 IE9, IE10, IE11対応 ビルド SCSS VS Codeエクステンション よかったチュートリアル これは何か 新機能開発をAngular4で作り始めました。その時に調べたことのメモです。 Angular CLI…

css - Resize to fit image in div, and center horizontally and vertically - Stack Overflow transformとposition: absoluteを利用します。 前の記事のアスペクト比を保つcssを利用するとこんな感じです。 object-fitというプロパティを利用すればもっと…

「padding-topに%を設定すると、包括しているブロックの幅を基準にする」という仕様を利用します。 padding-top - CSS | MDN 以下のコードは、アスペクト比を4:3にする場合。 .a43 { border: 1px solid #000; width: 160px; position: relative; } .a43:befo…

Angular4始めました。 Angularでエラーをインターセプトする場合はこんな感じ。 import { ErrorHandler, Injectable} from '@angular/core'; import { environment } from '../environments/environment'; @Injectable() export class GlobalErrorHandler im…

複数のプロジェクトやライブラリをみる場合に便利。 画像の例は、自分の仕事とAngularとBootstrap4を開いている場合。 // Place your settings in this file to overwrite default and user settings. { "workbench.colorCustomizations": { "titleBar.activ…