Help us understand the problem. What is going on with this article?

<Angular> overrideでバックエンドとの処理をきれいに書く

More than 1 year has passed since last update.

あらまし

  • 複数人でフロントを作成
  • Angular で Class を一つ一つ作るのがめんどい
  • バックエンドの処理とやり取りをする Service の返り値として受け取る型(クラス)がまちまち
    • component もそれぞれ変わるから統一しにくい・見にくい

その状況の1打開策。↓↓

やったこと

エラーの返し方、レスポンスの取り方を統一して、Service での返り値は下記でいう
Response を必ず継承させたものにしておく。

error-response.ts
export class ErrorResponse {
    StatusCode:number
    ErrorMessage:string
}
response.ts
import { ErrorResponse } from './error-response'

export class Response {
    header:ErrorResponse
    result:any
}
hoge.ts
import { Response } from './response'

export class Hoge {
    name:string
    id:number
}
// レスポンスを継承でアプリ内で使うクラスごとに定義しなくてもよくなる
export class ResponseHoge extends Response {
    result:Hoge 
}

これで、、、

  • StatusCode
  • Name
  • Id

またある人は

  • statusCode
  • data
    • name
    • id

またまたある人は

  • statusCode
  • result
    • name
    • id

うおーーー
という状況がなくなり

各APIごとの返り値を揃えられる。

なので、componentで値を処理する動きも統一、さらにバックエンド側の処理も統一できるため、
コード内が非常に見やすくなると思います。

hoge.component.ts
get(){
    let sub = this.Api.getHoge().subscribe(
      res => {
        if(res.header.StatusCode != 200){
          window.alert('エラー')
        }else{
          window.alert('name:' + res.result.name + ' id:' + res.result.name)
        }
      },
      err => window.alert('接続エラー')
    )
  }

ryotafull
趣味でコードを少し書いていましたが、仕事になりました。よく営業にいそうと言われるお話系エンジニア。 ごりごり要件を掘り起こして下からツンツンすることが得意。 重いバッグを持ち歩きたくない。
https://twitter.com/ryota_full
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした