社内ツールをバックエンドをGo(goa)で、フロントエンドをAngularで作ることにした。

4日目。

今日やったこと

ルーティング

そもそもルーティングの設計がおかしかったのと、謎の思い込みがあって、関係ないところで時間をつぶしていた。

// 抜粋
const appRoutes: Routes = [
  {
    path: 'projects',
    component: ProjectsComponent
  },
  {
    path: 'projects/new',
    component: ProjectDetailComponent
  },
  {
    path: 'projects/:id',
    component: ProjectDetailComponent
  },
];

この状態で /projects/new にアクセスすると、route parameter(と言うらしい)のidはnewになる。当たり前なんだけど、整数値の時だけ /projects/:id に振り分けられるという思い込みをしていた。

それに、Serviceでデータを取得する箇所でエラーが出ていたのに、ルーティングでのエラーだと勘違いしていた。

新規用ページの作成

編集ページを流用して、idが取れないときには空のオブジェクトを作ってComponentで使うようにした。

ようやく、一覧、新規、編集、削除とできた。

rxjs

Observable について深く気にしてなかったけど、rxjsと関係があるらしい。

使いこなせると、多分このコードも上手く直せるんだろうな。

  getProject() {
    let id = +this.route.snapshot.params['id'];

    if (id > 0) {
      this.projectService.getProject(id)
      .subscribe(project => this.project = project as Project);
    } else {
      this.project = new Project();
    }
  }

雑感

細かいところで色々わかってないところはあるものの、CRUDを実装したので、ダミーデータで一応動くようになった。

あとは、バリデーションとそれのメッセージ通知辺りかな。