引数はひとつで、コールバック関数です。このコールバック関数は、DOMが変更されたタイミングで実行されます。 コールバック関数の引数は以下の通りです。 第一引数は、MutationRecord[](省略可) 第二引数は、MutationObserver(省略可) 以下はMutationObserverインスタンス生成例です。 const mo = new MutationObserver((mr:MutationRecord[]) => { console.log(mr.length); }); このインスタンスにはobserve()メソッドがあり、このメソッドでDOMの変更検知をします。 observeの引数は以下の通りです。 第一引数は、監視したいノード(Node) 第二引数は、オプション(参考サイト) DOMが変更する種類はオプションで指定でき、例えば属性やスタイルなどが変わったらその
Angularではコンポーネントを動的に生成することができるのだが、いくつか注意が必要なことがある。ここでは、以下の内容について動的にコンポーネントを生成した際にどうしたら良いかを調べたのでまとめる。なお、このページでは「親コンポーネント」は動的にコンポーネントを生成する機能を持つコンポーネントを指すことにする。 動的コンポーネントの作成@Input/@Outputの設定コンポーネントの削除 基本的には「動的コンポーネントローダ」に書かれている内容だが、StackOverflowのコメントなど見る限り、コンポーネントの削除時にメモリリークをするような書き方がある気がする。 動的に生成するコンポーネントの準備 お題として、カウンタとその値を増減するボタン(+と-)と、カウンタを閉じるためのボタン x を持つコンポーネントを動的に生成する対象とする。見た目は以下のようにシンプルなもの。 コード
angular-cli 7.1.2で確認しました。 ng newで生成されるプロジェクトのangular.jsonの中身について、よく使う項目の調査です。 ルートオブジェクト $schema このファイルに関するJSON Schemaの定義ファイル "./node_modules/@angular/cli/lib/config/schema.json" 固定 https://github.com/angular/angular-cli/blob/master/packages/angular/cli/lib/config/schema.json version "1" 固定 cli 生成時にはない。 ngコマンド全般に対するデフォルトオプションを設定できる。 schematics 生成時にはない。 generate系のコマンドライン引数のデフォルトを設定できる。 また、ngコマンドで生成す
【Angular】なぜTemplateから関数を直接呼び出すとパフォーマンスの低下を起こすのか、とその対策Angular はじめに よくAngularのパフォーマンス改善で言われている「Templateからメソッドを直接呼んではいけない」はなぜなのか、をこちらの記事を参考に実際に試して確認、そしてその対策方法を共有する。 注意事項 今回はPipesをメインに紹介したいため、@Input()とChangeDetectionStrategy.OnPushを使った対策は割愛する。 今回使っていくソースコード 1~100までの数値とその数値が偶数かどうかを表示する。 数値の横のボタンがクリックされると、その数値を100倍にして更新する。 import { Component, DoCheck } from '@angular/core'; @Component({ selector: 'app-c
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く