Troubleshooting why the Typescript Omit property is not functioning correctly when used with the 'as' keyword

When both properties are needed during registration, but only one is necessary after, the system utilizes Firebase built-in functions for authentication and registration purposes. All other information will be stored in the Firebase user collection.

The issue arises when there are two types of users: one for registration with a password, and another general type without:

export interface RegistrationUser extends firebase.UserInfo {
  email: string;
  password: string;
}

export type User = Omit<RegistrationUser, 'password'>;

registerUser(user: RegistrationUser) {
    this.auth.createUserWithEmailAndPassword(user.email, user.password).then(()=> {
      let newUser = user as User;
      // save user prop to firebase user collection
      this.collection.add(newUser);
    });
}

Even with the 'as' keyword, the password property is still being saved. How can I prevent the password from being stored in the user collection?

Thank you.

Answer №1

Typescript doesn't actually delete the property when you use it in this way. It is primarily for type checking during static analysis (as Typescript does not affect runtime). In order to truly remove the property, you must implement something along these lines:

const newUser: User = {email: user.email};

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

Create a sleek and innovative tree user interface in a single line with the power of Angular and fxF

I created a tree with parent and child nodes, but I'm facing an issue where the positions of the checkboxes are not aligned in a straight line. Here is my code snippet: <mat-tree-node *matTreeNodeDef="let node" matTreeNodeToggle> ...

Changing {number, Observable<string>} to Observable<number, string> is a necessary transformation to be made

Is there a way to convert an array of objects with the following structure: { id: number, data: Observable<string> } into an array of objects with this structure: Observable<{id: number, data: string}> using only RxJS operators? ...

Deriving the type of a generic parameter from another generic parameter in TypeScript

Apologies for the less-than-descriptive title of this question, but sometimes it's easier to demonstrate with code rather than words. Here's a snippet that's causing issues, and I'm wondering why it's not behaving as expected: int ...

Error encountered while attempting to obtain OAuth2 API authorization token in ExpressJS Node.js Angular: "getaddrinfo ENOTFOUND"

Recently, I developed an angular application that sends an HTTP post request to a Node/Express.js endpoint upon clicking a button in order to obtain an authorisation token. I successfully configured the necessary credentials for basic OAuth2 authorisation ...

What is the best way to add JSX to the DOM using React?

Looking to make an addition to my DOM. let parent = document.getElementById("TabContainer"); let settings = <Box id="test"> <GlobalSettings activeTab={"test"}></GlobalSettings> </Box> ...

Leveraging NGRX in an Angular Library

Incorporating NGRX into my application has been a seamless process. However, I encountered a challenge in my Angular Library where I needed to integrate that same NGRX module and build upon it. Unfortunately, I faced an issue when attempting to invoke Stor ...

Angular, Bootstrap, and the magic of routing

I have created a menu along with breadcrumbs using components and their children. The issue arises when I try to view the grandchildren of a component; they appear under their parent component. My aim is to display only the child component without the pa ...

Determine the full location information with the help of Google Maps SDK without the need

My current challenge involves dealing with a list of unformatted and incorrectly written addresses. I am seeking a way to iterate through these flawed strings and generate more organized and accurate addresses using one of the many Google Maps SDKs availa ...

How to show specific information for individual items using Angular

In my current project, I am utilizing angular 7 and bootstrap 4. My goal is to display detailed information right below the selected item. The screenshot below shows where I'm currently at: https://i.sstatic.net/su9tI.jpg Here is what I aim to achie ...

Getting the PlayerId after a user subscribes in OneSignal with Ionic2

Currently working on an app with Ionic2 and facing a challenge with retrieving the player id after a user subscribes in order to store it in my database. Any suggestions on how I can retrieve the unique player id of OneSignal users post-subscription? ...

Can you please explain the process of implementing server-side rendering with React?

During my work, I utilized Node's express for sever side rendering with React. However, an unexpected error occurred as shown below. ^ SyntaxError: Unexpected token '<' This particular error popped up unexpectedly. I reached ou ...

Angular 6: Retrieving an array of objects from JSON using the httpClient in Angular

My goal is to populate a table with data retrieved from my backend API. The table requires an input called rows, which should be an array of objects. Each object represents a row in the table and contains key-value pairs for column names and values. The ba ...

WebStorm is failing to identify globally scoped external libraries

I'm currently working on a project using AngularJS (1.6.5) in WebStorm. The issue I'm encountering is that WebStorm isn't recognizing the global variables that AngularJS defines. I've made sure to install AngularJS and the correct @type ...

How are numbers in JSON represented when they are sent over a network - in binary form or as text?

I have a question that may seem trivial but is actually quite important. When I convert an object to JSON, how are numbers represented? Specifically, I am curious about the efficiency of encoding numbers to binary. There are two possible methods: Conver ...

Mapping a JSON array within a static method in Angular2 and TypeScript

Struggling with the syntax to properly map my incoming data in a static method. The structure of my json Array is as follows: [ { "documents": [ { "title": "+1 (film)", "is-saved": false, ...

Resetting the Angular2 poller in an ng-bootstrap accordion

I am currently utilizing a multi-dimensional array connected to a reactive poller that waits for a database state update. Interestingly, when I initially load the state once, the user interface functions as intended. However, a challenge arises when I act ...

The element's 'nativeElement' property cannot be accessed because it is undefined

I have a scenario where I have a parent component and a child component. I am trying to access the DOM element of the Child component from the Parent component, but I keep encountering an issue with the native element being undefined. export class ChildCom ...

A change in the Angular Universal page is only reflected after a mouse event

After migrating an Angular 5 app to Angular Universal, I've noticed some strange behavior. The pages seem to render correctly, but only after a mouse action is performed. For example, the page initially loads (presumably the server-side version), but ...

Is a local snapshot stored by Firebase Firestore?

In my chat room application, I am utilizing Firebase Firestore for data storage. One of the functions in my app handles sending messages to Firebase like this: const sendMessageHandler = message => { if (message) { firestore() .collection(` ...

Leveraging Angular 6: Implementing custom scripts on a component basis and verifying their presence

I need some help with a script that I want to run on a specific component only. I've managed to add the script to the component, but there are a few issues that I'm unsure how to fix. When I go to the component, the script is added to the DOM b ...