JavaScript
ag-gridというライブラリがとても便利でお世話になっているので導入から使い方の備忘録を残していく ライセンスを購入すればだいたいなんでもできるというくらい色々機能がある(正直使いこなせていない感はある) JavaScript Grid www.ag-grid.com angularの…
angularのコンポーネントをnpmに公開したいと思ったので色々調べてみたところ ng-packagrというものがあるようでそれを使って実際に公開したところまでのメモ 今回は ngx-table-input というものを公開したのでそれを公開した時の流れを追っていきます バー…
独自のコンポーネントでもngModelを使ってデータバインディングをしたい ngModelを使うことでvalidationなども他のinputなどと同様に扱いたい ということで公式のドキュメントにも乗っているのでやってみます angular4で実装してます Angular - ControlValue…
単純にmomentとmoment-rangeをimportしただけだとコンパイルが通らず使えないので対応する必要がありました stackoverflowなどでこうしたらいいよって書いてあったのでやってみたがコンパイルエラーで通らない 使えるようになるまでにやったことのメモ versi…
親子関係を持った入れ子のデータなどを表示したいといった用件があったときのメモ angularのバージョンは4を使っています データは下記のような感じ stats = [ { id: 1, name: 'A001', depth: 0, children: [ { id: 2, name: 'A002', depth: 1, children:[ {…
今回はtemplate drivenでのフォーム作成、validationまでやってみます angular4系で動作させてます template driven form とりあえずテキストフィールド一つ作ります app.component.ts import { Component, OnInit } from '@angular/core'; @Component({ sel…
フォームの金額入力とかで、入力時は1000000でフォーカスが外れたら1,000,000といったようにすることで大きい値でも判断しやすくなり入力ミスを減らしたい….. 今回は上記のような要望がちょろっと上がったので実際に試してみました フォーカスが外れたら3桁…
angularでクエリパラメータを扱う時のメモ 特定の結果を共有したいときとか、もともとgetのパラメータでやりとりしていればURLを共有するだけですが そうじゃない場合、意図的にURLにパラメータをつけてあげることで共有できるようにする必要があります レポ…
先日webstormでangularのコードを書いていた時に、この方がシンプルに書けるよ!みたいな誘導をされたので調べてみた話 書いてたコードは const isSetKey1 = (!params['key1']) ? true : false; 指摘された書き方は const isSetKey1 = !!params['key1']; こ…
よくあるパターンで何らかの条件によって別のテンプレートを読み込みたい、みたいな時 ngSwitchを使うことで条件によって表示やテンプレートを出し分ける、みたいなことができるようです ngSwitchで判定する値を指定 ngSwitchCaseで値ごとにタグを指定 ngSwi…
親子関係のコンポーネントでのデータのやりとりなら@Output,@Inputでいいですが、親子関係じゃない場合(遠い親子関係、横の関係)のパターン Serviceを使ってデータのやりとりをし、イベントを起こさせるところまでやってみます Observable,Subjectに関しては…
とりあえず起動させてみるのとbootstrapを使えるようにします インストール npm install -g angular-cli ng --help Cannot find module 'rxjs/symbol/observable' Error: Cannot find module 'rxjs/symbol/observable' 依存モジュールをインストール npm ins…
出先でサーバに対してコマンド打てないのがストレスだったのでslackから本番サーバにコマンド打てるようにしました 今回はbotkitを使っています hubotは有名ですが今更cofeescriptを覚える気にならなかったので他のものを探していたところちょうど手頃な感じ…
jsonファイルを用意するだけでAPIとして機能させることが出来る mock用のREST APIを簡単に立ち上げることが出来ます フロントエンド開発時やアプリ開発時にバックエンドの実装を待たずに開発に入ったりなんて事ができそうですね typicode/json-server 実際に…
今回はMkDocsで生成したサイト内にプレゼンテーション機能をつけたいと思います 動機 MkDocsでスライド用資料も管理したい 資料もプレゼンも一箇所で閲覧できるようにしたい(某wikiと同様) ということで、すこし調べてみた結果割と簡単にできそうだったので…
mkdocsのサイト内検索で日本語検索に対応していないという話があったので対応させたいなと思い調べてみた 中身を読んだらlunrという全文検索ライブラリを用いているよう jekyllにもlunr.jsを使ったプラグインがあるようで結構有名なのかな で、このlunr.jsが…
実際に使ってみたのでメモとして残しておきます bowerはフロントエンドパッケージマネージャと言われているようです jqueryとかangularとかそういうのをまとめて管理できるようにしたツールというイメージ rubyでいうbundlerとかに近いイメージですね bower…