P75 バブリングのキャンセル

イベントのstopPropagationメソッドを呼び出しておく事で、子要素で発生したイベントを拾って親要素も反応するという事を防ぐ事ができる。

click1(e: any) {
    e.stopPropagation();
    console.log('ここは呼び出されるが、親要素のバブリングは行われない');
}

Angularアプリケーションプログラミング

P69 $event

(click)="hoge(event)"では、undefinedとなってしまう。
angularでは、(click)="hoge($event)"の様に$eventオブジェクトを利用する必要がある。また、イベントハンドラ内で利用する際には、明示的に$eventを渡す必要がある。
イベントオブジェクトの主なメンバーについては、P71にまとめられている。

Angularアプリケーションプログラミング

P66 イベントバインディング

【構文】

<element (event)="exp">～</element>

element:任意の要素
event:イベント名(See. P67)
exp:イベント発生時に実行される命令(=テンプレートステートメント)

(例)

【注意事項】
●利用できない構文がある
テンプレートステートメントでは、以下の構文が禁止されている。
・new演算子
・インクリメント、デクリメント演算子
・複合代入演算子
・ビット演算子
・テンプレート演算子
テンプレート式では禁止されていたが、テンプレートステートメントでは利用できる構文もある。
・代入演算子
・連結演算子

●グローバル名前空間のオブジェクトが参照できない
テンプレート式と同様でテンプレートステートメントのコンテキストはコンポーネントのインスタンスのため、documentなどにはアクセスできない。

●テンプレートステートメントのガイドライン
副作用のあるコードを記述可能であるが、テンプレートステートメントに複雑な命令群はあまり利用すべきではない。
基本的には、シンプルなプロパティ割り当て、イベントの呼び出しに留めること。

Angularアプリケーションプログラミング

Linuxのマシン情報

情報種別	ファイル名等	格納場所	取得コマンド	内容
バージョン情報	-	-	uname -a	カーネル
バージョン情報	～release～(ex. redhat-release)	/etc	lsb_release -a	ディストリビューション
ログ	messeage	/var/log	-	シスログ
ログ	secure	/var/log	-	認証ログ
ログ	sa	/var/log/sa	-	性能ログ
ログ	各サービスのログ	/var/log/*	-	サービスに依存
設定ファイル	rsyslog.conf	/etc	-	シスログの設定
設定ファイル	各サービスの設定ファイル	/etc/*	-	サービスに依存
機器情報	-	-	fdisk -l	パーティション構成
機器情報	-	-	lsmod	組み込み中のモジュールリスト
機器情報	-	-	df -h	ディスク使用量
機器情報	-	-	rpm -qa	インストール済みRPM情報
機器情報	-	-	ps -H auxww(※1)	プロセスリスト
機器情報	-	-	dmesg	カーネルログバッファの内容
機器情報	-	-	dmidecode	BIOS情報・機種情報
機器情報	meminfo	/proc	lshw -c memory	メモリ情報
機器情報	cpuinfo	/proc	lshw -c processor	CPU情報
機器情報	cmdline	/proc	-	カーネル起動オプション
機器情報	partitions	/proc	-	パーティションとデバイス構成
機器情報	interrupts	/proc	-	割込み情報
機器情報	-	-	lspci -tv	PCIデバイス情報
機器情報	-	-	sysctl -a	カーネルパラメータ
機器情報	-	-	systemctl list-units	ロードされたユニットの一覧
構成情報	-	-	screenFetch, neofetch(※2)	環境の構成情報

※1 psコマンドでの詳細確認方法

ps eo 'pid ppid  stat uid %cpu %mem vsz rss tty time wchan:24 command'

　(オプション及び項目補足)
　eオプション：実行しているコマンド名と環境変数を表示する
　oオプション：指定したリスト順の出力形式で表示する
　wchan:数値：プロセスがイベント待ちしているカーネル関数をシンボル名で表示、数値を指定すると表示領域が広くなる(デフォルト20)
　(statのステータス一覧)
　　R：実行中または実行可能状態(実行キューにある)
　　S：割込可能なスリープ状態
　　D：割込不可能なスリープ状態(通常I/O待ち)
　　T：停止処理中、またはトレース中
　　Z：ゾンビ状態(停止したが、親プロセスから未回収)
　　s：セッションリーダー(セッションの生成者)
　　l：マルチスレッド化されている
　　＋：フォアグラウンドのプロセスグループに含まれている
　　＜：優先度の高いプロセス

※2　基本的にはデフォルトではインストールされていないため、別途導入する必要有

(参考リンク)
qiita.com

ソフトウェアデザイン 2020年4月号

新しいLinuxの教科書

P59 属性とプロパティ

属性は要素の初期値を表すのに対して、プロパティは現在値を表す。

<input id="txt" type="text" value="hoge">
(中略)
txt.value = ''foo';
console.log(txt.value);  //foo
console.log(txt.getAttribute('value'));  //hoge

Angularアプリケーションプログラミング

P51 バインドとサニタイジング

・データバインディングによるテキストの埋め込みは、ただの文字列として出力される。
・inerHTMLプロパティにプロパティバインディングを行った場合でも、通常はscriptやbuttonなどサニタイジングされる。
・DomSanitizer#bypassSecurityTrustHtmlメソッド(戻り値の型はSafeHtml)を用いる事でサニタイジング処理が行われずに設定される。

Angularアプリケーションプログラミング

P50 プロパティバインディング

【構文】

[prop] = exp

prop:パロパティ名
exp:任意の式

【同じ意味となる方法】
template: ''
template: ''
template: ''
いずれの構文を利用するかは利用者の好みにもよるが、1つのアプリの中で統一するべきである。
通常は、ブラケット構文([prop]="exp")が良い。

Angularアプリケーションプログラミング