Angular 2-Typescriptでオプションのクラスパラメータを設定するにはどうすればいいですか? 質問する

Angular 2-Typescriptでオプションのクラスパラメータを設定するにはどうすればいいですか? 質問する

Typescriptで知っているオプションパラメータは次のようにマークできます疑問符

しかし、実際にクラスをインスタンス化する唯一の方法は新しいキーワード。

問題は、Angular 2のスターター「ヒーロー」チュートリアルクラスに基づいているということですないこれは new キーワードを介してインスタンス化され、私が理解している限りでは、Angular によって内部的に実行されます。

たとえば、次のようなコードがあります:

モデル/ユーザー.ts

export class User {
    id: number;
    name: string; // I want this to be optional
}

モデル/モックユーザー.ts

import {User} from './user';

export var USERS: User[] = [
    {
       id: 1
       // no name (I wanted it to be optional for user with id 1)
    },
    {
       id: 2,
       name: "User 2"
    },        
]

サービス/user.service.ts

import {Injectable} from 'angular2/core';
import {USERS} from './../models/mock-users';

@Injectable()
export class UserService {
    getUsers() {
         return Promise.resolve(USERS);
    }
}

ビュー/my-component.component.ts

// imports here...

@Component({
   // ...
})

export class MyComponent {
   constructor(private _userService: UserService) { }

   getUsers() {
         this._userService.getUsers().then(users => console.log(users));
   }
}

ベストアンサー1

あなたの場合は、代わりに User のインターフェースを使用する方が便利かもしれません。

export interface User {
    id: number;
    name?: string; // interfaces allow fields to be optional
}

オブジェクトの「形状」を定義したいときはインターフェースを使用し、動作 (メソッド) を追加する必要がある場合はクラスを使用します。データを移動させるだけであれば、インターフェースを使用します。

クラスが必要な場合は、Users のインスタンスを作成する構文がmock-users.ts少し異なります。まず、TypeScript には「オプションのクラス フィールド」はありません。どのフィールドも設定されていない/「未定義」になる可能性があるため、フィールドをオプションとしてマークしても意味がありません。キーワードを使用してクラスをインスタンス化できますnewが、欠点は、フィールド値を設定するコンストラクターを記述するか、インスタンスを変数に割り当ててフィールドを設定する必要があることです。ただし、特にテスト オブジェクトの場合は、new キーワードを使用しても問題ありません。

で行ったように、オブジェクト リテラルを使用してオブジェクトをインスタンス化することもできますmock-users.ts。キャストを追加して、より明示的にする必要があります。

export var USERS: User[] = [
    <User> { // explicit cast to let the TypeScript compiler know you know what you're doing
       id: 1
       // no name (I wanted it to be optional for user with id 1)
    },
    {
       id: 2,
       name: "User 2"
    },        
]

キャストがないと、TypeScript コンパイラはエラーを生成します。これは、間違いをキャッチするための設計です。(興味深い)理由についてさらに詳しく知りたい場合は、型チェックの背後にある考え方に関する詳細な説明がこちらにあります。

おすすめ記事