Is it Control or ControlGroup in Angular 2 - How to tell the difference?

let aa = this._formBuilder.control("");
let bb = this._formBuilder.group({
    aa: aa
};

I am trying to achieve the following:

if (typeof(aa) == "Control") {
    // perform a specific action
} else if (typeof(aa) == "ControlGroup") {
    // perform another specific action
}

Currently, both typeof(aa) and typeof(bb) are returning object.

console.log(typeof(aa));  // object
console.log(typeof(bb));  // object

Is there a way to determine whether it is Control or ControlGroup? Thank you

Answer №1

The instanceof operator can be utilized in this scenario:

if (bb instanceof Form) {
  // carry out specific action
} else if (bb instanceof FormGroup) {
  // perform another task
}

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Repositioning the initial location of mat-slider

Currently, I am working on the mat-slider component and I have a specific requirement. I need to position the thumb in the middle and allow it to slide both left and right. Here is my code: https://stackblitz.com/edit/angular-9unenq-utcytk?file=app%2Fslid ...

What is the best way to increase a JSON value in a Typescript scenario? For instance, how can I add more

Is there a way to update JSON values in a TypeScript example by incrementing likes or dislikes when a button is clicked?https://i.sstatic.net/aon03.png movies: any[] = [ { name: "Fan", likes: 0, dislikes: 0, unseen: 0, fimage: "/images/fan.jpg" }, ...

The function signature '(newValue: DateRange<dateFns>) => void' does not match the expected type '(date: DateRange<unknown>, keyboardInputValue?: string | undefined) => void' as per TypeScript rules

I'm currently utilizing the MUI date range picker from https://mui.com/x/react-date-pickers/date-range-picker/. Here's my code snippet: <StaticDateRangePickerStyled displayStaticWrapperAs="desktop" value={valu ...

A specialized <T> interface, now enhanced with additional functionalities

Looking to create a generic type (with parameter T) that exhibits the following behavior: If K represents a key of T, allow the value type to be either T[K] | ((params?: Partial<T>) => string) If K is not a key of T, allow the value type to be ( ...

Failing to retrieve the file instance upon completing the upload process to cloudinary using nestjs

I am attempting to retrieve the secure file URL provided by Cloudinary after successfully uploading the asset to their servers. Although I can upload the file to Cloudinary, when I try to view the response using console.log(res), I unfortunately receive &a ...

Sending data to child components in Ionic

I am currently utilizing Ionic's router-outlet to navigate between a parent page and three children pages: parent.page.html <ion-content> <ion-router-outlet></ion-router-outlet> </ion-content> parent-routing-module.page.t ...

Tips on customizing KendoUI-Dialog titlebar using CSS for a single component

I am struggling with styling the KENDO UI dialog in a unique way: Imagine I have a component named WatComponent. Inside this component, When the user clicks the "Forbidden" button, my goal is to make a warning styled dialog appear, with a yellow/orange ...

Initial request in the sequence is a conditional request

Currently, I am attempting to make a request in rxjs that is conditional based on whether or not the user has uploaded a file. If a file has been uploaded, I need to attach it to the user object before sending it off, and then proceed to patch the user aft ...

I encountered an error while attempting to create an npm package from a forked repository on GitHub

Check out this GitHub repository: https://github.com/jasonhodges/ngx-gist Upon running the package command, I encounter an error: rimraf dist && tsc -p tsconfig-esm.json && rollup -c rollup.config.js dist/ngx-gist.module.js > dist/ngx- ...

Unable to retrieve data from all clients in Angular / Nest.js using socket.io

I have been experimenting with socket io in a small project using angular and nestjs. However, I am facing an issue where the data is only being received on the same client that it was sent from. The other clients are not updating their components after e ...

Separate files containing TypeScript decorators are defined within a project

(Let's dive into Typescript and Angular2, shall we?) Having primarily coded in Symfony2 with annotations, I found it convenient to configure entity mapping, routing, and other features using yaml, xml, or plain PHP. This flexibility was great for cre ...

JavaScript: exporting everything from ... causing excessive bloat in the build file

After building my react-app with create-react-app, I noticed a decline in performance. Here is the structure of my project: /store actions.ts reducers.ts /module1 module1.actions.ts module1.reducers.ts /moduleN moduleN.actions.ts m ...

Guide to correcting the file path of an external css within the public directory on Express framework

I am facing an issue with loading external CSS files and need some help to fix the path. Despite multiple attempts, I have been unsuccessful so far. Below is my category structure: https://i.stack.imgur.com/sLTcN.png Within the header.ejs file, this is h ...

Attempting to combine numerous observables into a single entity within an Angular 2 project

I am grappling with the concept of Observables in RxJs. My task involves displaying all users for a specific site on a page. The User and SiteUser entities are located in separate API endpoints. Here are the relevant endpoints: userService.getSiteUsers(si ...

Ways to dynamically link a JSON response object to an entity?

In my ng2 implementation, I have a user.service.ts file that calls a REST service and returns JSON data. The code snippet below shows how the getUser function retrieves the user information: getUser(id: number): Promise<User> { return this.http. ...

In Rxjs, Subscribe now emits individual items one at a time instead of emitting a list all at once

I've encountered an issue in my Angular 4 application while working with Rxjs and I can't seem to figure out the behavior. Here's a snippet of my code: this.server.get("incidents") //http get resource .flatMap((res) => res.value) //the ...

Setting an expiry date for Firestore documents

Is it feasible to set a future date and time in a firestore document and trigger a function when that deadline is reached? Let's say, today I create a document and specify a date for the published field to be set to false fifteen days later. Can this ...

A step-by-step guide to implementing Auth0 login within an iframe

I recently developed a basic Angular app that features a Login with Auth0 button. The functionality works perfectly when accessed directly through the browser, allowing users to log in successfully. My ultimate goal is to embed this app into another webpag ...

"Enhance your user experience with seamless drag and drop functionality for transferring items between

I am currently working on transferring items between a list and table using the drag-and-drop feature of PrimeNG. Both elements should be able to act as both drag sources and drop destinations. My project is based on PrimeNG-9.0.0 and Angular 9.0.2 https ...

Learn How to Implement Styling in Material UI using Styled Components

Utilizing styled-components with MaterialUI integration. Encountering the following error in LoginTextField component and seeking a resolution. Error Message: [ts] Type '{ width: number; }' is missing the following properties from type &apos ...