Angularで新しいモジュールとルートを作成する方法


まず、Angular CLIを使用して新しいモジュールを作成します。ターミナルまたはコマンドプロンプトで以下のコマンドを実行します。

ng new module-name

"module-name"の部分を作成するモジュールの名前に置き換えてください。このコマンドは、必要なファイルやフォルダを作成し、基本的な構造を持つ新しいAngularモジュールを作成します。

次に、作成したモジュールに関連するルートを設定します。Angularでは、ルートはAngular Routerを使用して定義されます。ルートを定義するために、以下の手順を実行します。

  1. app-routing.module.tsという名前のファイルを作成します。
  2. 作成したファイルを開き、ルートを定義します。以下は、ルートの例です。
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
// ルートの定義
const routes: Routes = [
  { path: 'home', component: HomeComponent },
  { path: 'about', component: AboutComponent },
  // 他のルートを追加することもできます
];
@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

上記の例では、pathプロパティにはURLパスが、componentプロパティにはそのURLパスに関連付けられるコンポーネントが指定されています。HomeComponentAboutComponentは、それぞれホームページとアバウトページを表すコンポーネントの例です。

これで、新しいモジュールと関連するルートが設定されました。必要に応じて、他のコンポーネントやサービスなどを追加してモジュールを拡張することもできます。