TS2339: The type does not have a property called "assign"

I have a file that contains fixed data under the name QRCategories and I need to transmit this data as an observable.

The service responsible for sending this data is:

public qrCodeCategoriesList(): Observable<QRCategoryListResponse> {
    return of (QRCategories);
  }

This service is utilized in a component as follows:

ngOnInit() {
   this.qrCategoryService.qrCodeCategoriesList().subscribe(
     res => {
       this.qrCategories = res;
     }, error => {
       console.log(error);
     }
   );
  }

Although it functions without any issues, there is an error showing "Property 'assign' does not exist on type" within a different component in the following code snippet:

  const formData: RegisterData = this.registerForm.value;
  const password2 =   {password2: formData.password1};
  const data = Object.assign({}, formData, password2);

qr-category.ts

import {QRCategoryListResponse} from '../models/qr/qr-category.model';

export const QRCategories: QRCategoryListResponse = {
  count: 10,
  next: null,
  previous: null,
  results: [
    {
      id: 1,
      name: 'Website URL',
    },
    {
      id: 2,
      name: 'Google Maps',
    },
    {
      id: 3,
      name: 'PDF',
    },
    {
      id: 4,
      name: 'Image',
    }
   ]};

Answer №1

Give this a shot:

let info = Object.assign(formData, password2)

or

info = {...formData,...password2};

If you need to copy nested objects by reference, consider using a deep copy method like from a library such as Lodash, or :

JSON.parse(JSON.stringify(someData));

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

Determine the sum of exported identifiers based on ESLint rules

Currently, I am facing a requirement in my JavaScript/TypeScript monorepo to ensure that each library maintains a minimal amount of exported identifiers. Is there any existing eslint rule or package available that can keep track of the total number of exp ...

Iterate through controls to confirm the accuracy of the password输入 unique

Struggling a bit here since ControlGroup is no longer available. I need to ensure that two passwords match on the front end. this.updatePassordForm = _form.group({ matchingPassword: _form.group({ password: new FormControl('' ...

The headers in the Angular HttpClient Response Object do not show up in the network tab of browsers or when using PostMan

Here is the function that makes a POST call to the server: submitData(credential){ credential = JSON.stringify(credential); return this._http.post("http://localhost:8080/login",credential,{observe: 'response'}); } In this section ...

"Encountering a Server Error when attempting to refresh routing children

My project is hosted on a subDirectory server with Apache. The base index for my project can either be <base href="./"> or <base href="/myFolder/">. The issue arises when I am on a child route page, for example: www.mysite ...

What is the best way to use the cursor-pointer property in combination with a (click) event handler

<i class="cursor-pointer" (click)="sort()"></i> Our development team is grappling with numerous repetitive class definitions such as this one. I wanted to find a more efficient way to automatically add the cursor pointer style whenever a (clic ...

What is the alternative to the deprecated 'combineLatest' method in rxJs and how can it be replaced?

Recently, I came across a situation where I had implemented a method using the combinlatest rsjx/operator. It was working perfectly fine. However, Sonar flagged it as deprecated and now I need to update it to the latest version. When I tried to simply re ...

io-ts: Defining mandatory and optional keys within an object using a literal union

I am currently in the process of defining a new codec using io-ts. Once completed, I want the structure to resemble the following: type General = unknown; type SupportedEnv = 'required' | 'optional' type Supported = { required: Gene ...

Assign a specific value to the sub-component within the grid using Angular 2+

Incorporating Angular 8 and TypeScript into my project, I have a grid that consists of various internal components, one being <ng-select/>. The data binding takes place in the child component during onInit. Upon loading and initialization of the dat ...

Implementing TypeScript for augmented styling properties in a component - a guide

I have custom components defined as follows: import React from 'react'; import styled from '../../styled-components'; const StyledInput = styled.input` display: block; padding: 5px 10px; width: 50%; border: none; b ...

Utilizing cellRendererParams in Ag-Grid version 19 with Angular 6 to execute a function within my component

One issue I encountered in my Ag-grid column was when I added a component that required calling a function from my controller. While I could access the controller without any issues, attempting to call another function proved problematic. This occurred bec ...

Guide on integrating TinyMce into an Angular 2 application

Recently I started working with Angular 2 and attempted to incorporate tinymce into my project. However, I encountered challenges in successfully implementing tinymce. Initially, I used bower to install tinyMCE and added all the necessary js files to my pr ...

Renderer's Delayed Electron Loading

I am in the process of developing a Electron application using TypeScript and React. This application serves as an account manager, allowing users to retrieve and view data for specific accounts. However, I have encountered an issue with the ipcMain.on(&a ...

Easy steps to bring in type definitions from an npm package using Vite

I am currently developing a package with several ts functions that will be utilized by multiple repositories, including mobile and web applications. In our team, we use vite as our primary build tool, which is also integrated into the repository. Below is ...

I am interested in creating a checkbox filtering system using Angular

Below is the display from my project's output window view image description here In the image, you can see checkboxes on the left and cards on the right. I want that when a checkbox is checked, only the corresponding data should be shown while the r ...

Using [(ngModel)] in Angular does not capture changes made to input values by JavaScript

I have developed a custom input called formControl, which requires me to fetch and set its value using [(ngModel)]: import { Component, Injector, OnInit, forwardRef } from '@angular/core'; import { ControlValueAccessor, FormControl, NG_VALUE_ACCE ...

My React JS page suddenly turned blank right after I implemented a setState() function within my functional component

I was working on my code and everything seemed fine until I tried to incorporate the setState function with setcategory and setvalue. However, after making this change, my react page suddenly went blank. Can anyone help me identify what went wrong and pr ...

The Javascript code for sleep execution is operational, yet it appears to be not inducing any noticeable delays

This Angular app contains code that runs inside a webworker written in Typescript. As someone new to working with webworkers, I have encountered an issue where both the sleep function and the loop seem to be executing within the same thread. The main goal ...

What is the best way to provide props to a Link Router component?

Hey there, I'm looking to pass props to another component using Link Router My approach involves using a Class Component constructor(props: IBanner) { super(props); this.state = { jobCategories: [], jobKeyword: "", ...

When using Angular and Express together, the session is not continuous as each new request generates a fresh session

Unique Question I have encountered an issue with passport.js while trying to implement authentication in my express application. When I use req.flash('message', 'message content') within a passport strategy, the flashed information see ...

Server-Side Rendering will occur exclusively for the `/` url, but only upon reloading the landing page. This setup utilizes Angular 16, implements Lazy Loading, and runs

Whenever I run my Angular ionic application locally and refresh the pages (all of them), I notice these console logs popping up on my screen. However, once I deploy it on PM2 in a production environment, the console log only shows up for the home page. I ...