Как вызвать переменную двух типов в Angular/Typescript?

Допустим, у меня есть эта переменная с типом, как показано ниже:

test?: boolean | { [key in TestEnum ]: boolean };

И я установил эту переменную test внутри константы, где это может быть просто логическое значение или сопоставление с перечислением. См. пример ниже:

ПРИМЕРЫ ЗНАЧЕНИЙ, ЗАДАННЫЕ В ПОСТОЯННОМ ОБЪЕКТЕ

export const TEST_1 {
  name: "Mark",
  test: {
    [TestEnum.Value1]: false,
    [TestEnum.Value1]: true,
    [TestEnum.Value1]: true,
    [TestEnum.Value1]: true
  }

  }
};

export const TEST_2 {
  name: "Mark",
  test: true
  }
};

Как мне вызвать эту тестовую переменную в моем компоненте, поскольку она может быть просто test или test[TestEnum.Value2]

typescriptlang.org/docs/handbook/2/narrowing.html

— 04.07.2024 18:25

angular typescript

04.07.2024 18:06

Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest

В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...

Angular и React для вашего проекта веб-разработки?

Когда дело доходит до веб-разработки, выбор правильного front-end фреймворка имеет решающее значение. Angular и React - два самых популярных...

Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf

Мы провели Twitter Space, обсудив несколько проблем, связанных с последними дополнениями в Angular. Также прошла Angular Tiny Conf с 25 докладами.

Угловой продивер

Оригинал этой статьи на турецком языке. ChatGPT используется только для перевода на английский язык.

Мое недавнее углубление в Angular

Недавно я провел некоторое время, изучая фреймворк Angular, и я хотел поделиться своим опытом со всеми вами. Как человек, который любит глубоко...

Освоение Observables и Subjects в Rxjs:

Давайте начнем с основ и постепенно перейдем к более продвинутым концепциям в RxJS в Angular

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Как описано в справочнике , вы можете выполнить сужение типа с помощью TypeScript, используя оператор typeof. В вашем случае вы можете проверить, является ли значение логическим значением или объектом:

export interface MyInterface {
    name: string;
    test?: boolean | { [key in TestEnum ]: boolean };
}

export const TEST_1: MyInterface = {
  name: "Mark",
  test: {
    [TestEnum.Value1]: false,
    [TestEnum.Value2]: true,
    [TestEnum.Value3]: true,
    [TestEnum.Value4]: true
  }
};

export const TEST_2: MyInterface = {
  name: "Mark",
  test: true
};

function process(value: MyInterface) {
    if (typeof value.test === 'boolean') {
        console.info(value.test) // we know that this is a boolean;
    } else if (typeof value.test === 'object') {
        console.info(value.test[TestEnum.Value2]); // we know that this is an object so we can access the properties
    }
}

Также посмотрите эту демонстрацию на игровой площадке TypeScript, там я также добавил попытку доступа test[TestEnum.Value2] за пределами typeof охранника, что приводит к ошибке.

здорово, большое спасибо за объяснение!

— 07.07.2024 10:58

05.07.2024 08:45