web-dev-qa-db-ja.com

クラス内の列挙(TypeScript定義ファイル)

私は周りを検索しましたが、これに対する答えが見つからないようです。 Imageに列挙型を追加するにはどうすればよいですか?これは理想的ですが、エラーが発生します。

declare module 'Lib' {

  export module Graphics {

    export class Image {

      enum State {}

      static STATE_IDLE: State;
      static STATE_LOADING: State;
      static STATE_READY: State;
      static STATE_ERROR: State;

      constructor();

    }

  }

}

StateをGraphicsモジュールに移動すると動作しますが、StateはGraphicsに属します。これは正しくありません。Imageの一部である必要があります。

何か案は?ありがとう

48
Lewis Peel

私は解決策を見つけたと思う...それが有効なTypeScriptであるかどうかは知りませんが、動作し、コンパイルエラーは発生しません。上記の答えの組み合わせです。

declare module 'Lib' {

  module Graphics {

    module Image {
      enum State { }
      var STATE_IDLE: State;
      var STATE_LOADING: State;
      var STATE_READY: State;
      var STATE_ERROR: State;
    }

    class Image {
      constructor();
    }

  }

}

誰も気付いていない潜在的な問題を見つけることができますか?

2
Lewis Peel

私も最近この問題にぶつかりました。これは私が現在ソリューションとして使用しているものです:

// File: Image.ts

class Image
{
    constructor()
    {
        this.state = Image.State.Idle;
    }

    state: Image.State;
}

module Image
{
    export enum State
    {
        Idle,
        Loading,
        Ready,
        Error
    }
}

export = Image;

次に、クラスとその列挙を使用している場所で:

import Image = require("Image");

let state = Image.State.Idle;
let image = new Image();
state = image.state;

これはうまくいくようです(この種のことを行うための期待される方法とは考えていませんが)。

TypeScriptで次のようにする方法があればいいのですが。

class Image
{
    enum State
    {
        Idle,
        Loading,
        Ready,
        Error
    }

    constructor()
    {
        this.state = State.Idle;
    }

    state: State;
}

export = Image;
35
KoenT

以下は、トップの投票ソリューションの改善であると思います。

export class Image
{
    constructor ()
    {
        this.state = Image.State.Idle;
    }

    state: Image.State;
}

export namespace Image
{
    export enum State
    {
        Idle,
        Loading,
        Ready,
        Error
    }
}

利点は、名前付きインポートを活用できることです:

import {Image} from './image';
let img = new Image()
img.state = Image.State.Error
31
NSjonas

これが私の解決策です。

program.ts:

enum Status {
    Deleting,
    Editing,
    Existing,
    New
}

export class Program {
    static readonly Status = Status;
    readonly Status = Program.Status;

    title: string;

    status: Status;

    constructor(init?: Partial<Program>) {
        Object.assign(this, init);
    }
}

使用法:

let program = new Program({ title: `some title` });

program.status = Program.Status.New;

または

program.status = program.Status.New;

Angular 2+ユーザーに利点を追加:これはテンプレートで使用できます

<div *ngIf="program.status === program.Status.New">
  Only display if status of the program is New
</div>

このモジュール拡張機能は、非常にハック的で直感的でない方法*であると思うので、これを考慮してください:

export module Graphics
{
    enum State
    {
        STATE_IDLE,
        STATE_LOADING,
        STATE_READY,
        STATE_ERROR
    }

    export class Image
    {
        constructor() { }
        public static readonly State = State;
    }
}

//...

let imgState = Graphics.Image.State.STATE_ERROR;

つまり、エクスポートせずに追加するクラスのスコープで列挙型を宣言し、クラスのメンバーを通じて公開します。

*技術的には機能しているとしても、コードの構造化と組織化に関して悪いのはどれですか。

更新

declare module Lib
{
    enum State
    {
        STATE_IDLE,
        STATE_LOADING,
        STATE_READY,
        STATE_ERROR
    }

    class ImageClass
    {
        constructor();
        public Prop: any;
    }

    export interface Graphics
    {
        Image: typeof State & ImageClass & (new () => typeof State & ImageClass);
    }
}

declare var Graphics: Lib.Graphics;

次に、次のように入力します。

var someEnum = Graphics.Image.STATE_ERROR;
var image = new Graphics.Image();
var anotherEnum = image.STATE_IDLE;
3
Alex

あなたが何をしようとしているのか分かりませんが、enumが可能な状態値を表し、次に画像上のstateメンバーが現在の状態を示すことを期待すると思います。画像の。

declare module 'Lib' {
    export module Graphics {

        enum State {
            STATE_IDLE,
            STATE_LOADING,
            STATE_READY,
            STATE_ERROR
        }

        export class Image {
            public state: State;

            constructor();
        }

    }
}

クラス内で列挙型を宣言するのではなく、列挙型のようなメンバーを持つクラスを宣言したいようです。すなわち:

declare module 'Lib' {

    export module Graphics {

        export class Image {
            static STATE_IDLE: number;
            static STATE_LOADING: number;
            static STATE_READY: number;
            static STATE_ERROR: number;

            constructor();
        }
    }
}
1
Fenton

同じ名前のモジュールとクラスを作成できます。また、Stateを2回言う必要がないように、enumの名前を変更すると役立つ場合があります。

declare module 'Lib' {
    export module Graphics {
        export class Image {
            constructor();
        }

        export module Image {
            export enum State {
                Idle,
                Loading,
                Ready,
                Error
            }
        }
    }
}
0
David Sherret