Looking to retrieve all values from a string enum. For example, in the following enum, I want to extract ["Red", "Yellow"]
:
export enum FruitColors {
Apple = "Red",
Banana = "Yellow",
}
Looking to retrieve all values from a string enum. For example, in the following enum, I want to extract ["Red", "Yellow"]
:
export enum FruitColors {
Apple = "Red",
Banana = "Yellow",
}
Seeking Object.values()
is the way to go
Take a look at the FruitColors
object.
Keep in mind that if you do not provide names for the enum values, the resulting code will be different and a basic key/value mapping may produce incorrect outcomes. For example:
export enum FruitColors {
"Red",
"Yellow",
}
Object.values(FruitColors); // ["Red", "Yellow", 0, 1]
This is because the generated code is structured like this:
var FruitColors;
(function (FruitColors) {
FruitColors[FruitColors["Red"] = 0] = "Red";
FruitColors[FruitColors["Yellow"] = 1] = "Yellow";
})(FruitColors = exports.FruitColors || (exports.FruitColors = {}));
You can then easily filter the results by using
typeof value == "string"
.
As stated in a GitHub thread, the recommended approach is:
Object.keys(FruitColors).map(c => FruitColors[c]);
If you're looking to extract all values from a string and number enum type, not just strings, you might consider using this function:
const retrieveAllEnumValues = (enumType: any) => {
const keysAndValues = Object.values(enumType);
const values = [];
keysAndValues.forEach((keyOrValue: any) => {
if (isNaN(Number(keyOrValue))) {
values.push(enumType[keyOrValue] || keyOrValue);
}
});
return values;
};
For example:
enum SampleEnum {
X = "x",
Y = 3,
Z = "z",
W = 2,
}
The function will output [ 2, 3, 'x', 'z' ] as expected.
Currently, I am running jest unit tests in Angular 11 and facing an issue while testing methods within the .then method. It seems like the test methods are not being executed at the expect method. I need guidance on how to structure the test code to ens ...
I am attempting to integrate emoji-mart into my application, but I keep encountering a persistent error. Here is the snippet of code causing the issue: import data from '@emoji-mart/data' import { Picker } from 'emoji-mart' {showEmoji ...
I've been facing an issue with accessing the :id route parameter in a router guard. It seems to always return an empty Object{}. Initially, I was unsure of how to approach this problem, so I referred to this question for guidance. However, it didn&ap ...
I am seeking a way to store the result of an initial request and then retrieve that stored value for subsequent requests. Currently, I am utilizing promises and chaining them to achieve this functionality. While my current solution works fine, I am interes ...
Having an issue with a search dropdown that displays suggestions when the search input is focused. The problem arises when the dropdown closes as soon as the input loses focus, which is the desired functionality. However, clicking on any suggestion causes ...
I have a large table with more than 1000 entries that I want to display using a <mat-table></mat-table>. Since loading all the entries at once would be too much, I am looking to implement pagination and load only 20 entries per page. The chal ...
Hello everyone! I'm in need of some assistance. I am trying to test my service tree with a specific structure. Here is an overview of my test: describe(`Service selector`, () => { describe(`getCurrentServiceTree`, () => { it(`should bui ...
I am currently utilizing GraphQL and Typeorm in conjunction with an Oracle Database, specifically focusing on retrieving all data from a specific table. The query that is being executed is: SELECT "inventory"."id" AS "inventory_id", "inventory"."value" AS ...
In my current situation, I encountered the following scenario: I have a service that makes Http calls to an API and requires access to user data to set the authentication header. Below is the function that returns the observable used in the template: get ...
Currently, I am utilizing a service to gather user responses from a questionnaire. The sequence of events is outlined below: questionnaire.component.ts : serves as the main container that receives data from question.service.ts question-shell.component.ts ...
Here is the tsconfig file for my Vue project: { "extends": "@vue/tsconfig/tsconfig.web.json", "include": ["env.d.ts", "src/**/*", "src/**/*.vue", "src/**/*.json"], "exclude ...
I have a question regarding type checking in React components passed as props: What is the method for ensuring that only allowed components are passed as props? Allow me to demonstrate. We have the component we wish to pass around: type CustomProps = { ...
Currently implementing flow and looking to enhance the type safety of my reducers. I stumbled upon a helpful comment proposing a solution that seems compatible with my existing codebase: https://github.com/reduxjs/redux/issues/992#issuecomment-191152574 I ...
I have a specific object structure in my code that I need to work with: { "changeRequest": [{ "acrId": 11, "ccrId": "", "message": "test message" }, ...
Recently diving into the world of TypeScript, I've been navigating my way through with relative ease. However, I've encountered a perplexing issue while working with async/await. The problem lies within this code snippet - the 'await' ...
My model is pretty straightforward: export class Profile extends ServerData { name: string; email: string; age: number; } Whenever I make a server call using Angular 4's $http, I consistently receive this response: { name: string; email: ...
Is it possible to display a file dialog in a Node.js TypeScript project without involving a browser or HTML? In my setup, I run the project through CMD and would like to show a box similar to this image: https://i.stack.imgur.com/nJt3h.png Any suggestio ...
Currently, I'm attempting to create a reusable component using MUI Datepicker and React Hook Form However, the parent component is throwing an error Type '{ control: Control<FieldValues, object>; name: string; }' is missing the follow ...
Issue with Angular Material Autocomplete component not displaying items after updating angular/material package to the latest version. The autocomplete was functioning correctly with "@angular/material": "^2.0.0-beta.10" but encountered issues when update ...
Trying to define a type that can be one of two options, currently attempting the following: type TestConfig = { file: string; name: string; } type CakeConfig = { run: string; } type MixConfig = { test: TestConfig | CakeConfig }; const typeCheck: M ...