Angular Angularのlocalhostのwebサーバにスマホから接続する方法
Angularプロジェクトをローカルで立ち上げたときに、スマホ画面などを確認するときに、スマホからアクセスしたいときがあったので、やり方をまとめておきます。Angular側の設定Angularプロジェクトを通常、ng serveでwebサー...
Angular
Angular Angular [Angular] JasmineテストのMatchers一覧
概要Angularのテストして利用されるJasmineのMatchersを一覧にしてまとめていきます。Matchersとは以下のように、期待値を比較するのに使われるメソッドです。expect(テスト値).toBe(期待値);Matchers...
Angular Angularのng testをVSCodeでデバッグする方法
デバッグの設定プロジェクト直下の.vscode/launch.jsonファイルに、"name": "ng test"の所が、ng testでデバッグができるようになる設定が書いてます。{ // For more information, ...
Angular [Angular] イベントバインディングのイベント一覧
概要以下のようにAngularのイベントバインディングを使う時に指定する、(click)のようなイベントについて主要なものをまとめておきます。<button (click)="onSubmit()">送信</button>Angularのイ...
Angular [Angular]タッチイベントを処理する
概要Angularでタッチイベントを処理するには、以下をディレクティブに設定することで対応できます。(touchstart)：タッチしたとき(touchmove)：タッチしたまま動かしているとき(touchend)：タッチを話したときサンプ...
Angular devopsでApp ServiceにAngularアプリをデプロイする(リリースパイプライン編)
概要angularプロジェクトをazure devopsでビルドパイプラインした結果から、リリースパイプラインを動かして、App Serviceにデプロイします。前提条件ビルドパイプラインでビルドしていることdevopsでApp Servi...
Angular devopsでApp ServiceにAngularアプリをデプロイする(ビルドパイプライン編)
概要Azure DevopsのReposにあるAngularアプリを、Azure DevopsのPipeline機能を使って、App Serviceへデプロイしていきます。この記事では、ビルドパイプラインの処理をまとめていきます。ビルドパイ...
Angular mat-dialogをドラッグさせる[Angular Material]
mat-dialogをドラッグさせるAngular Materialのダイアログをドラッグさせるようにしていきます。以下を参考に、ダイアログのドラッグ機能を追加します。また、DragDropModuleを使うのでインポートする必要があります...
Angular mat-dialogのヘッダーを作るのに余計なスペースを削除する [Angular]
mat-dialogのヘッダーについて以下のように、Angular MaterialのDialogを使って、ヘッダーを作ろうとすると余白が入ってしまう。<h1 mat-dialog-title>ヘッダータイトル</h1><div mat-d...
Angular [Angular] テンプレート側でメソッドを呼び出す方法とパフォーマンスについて
実践テンプレート側で、コンポーネントのメソッドを呼び出していきます。まずは、以下のようにaddメソッドをコンポーネントで作成します。import { Component } from '@angular/core';@Com...