Assigning object values in Angular 2 from a method parameter object

I've encountered an issue while working on my Angular 5 application. I have a model class called RoleClaimEntryDataModel and a method 'UpdateRoleClaimById' in one of my injectable services that takes RoleClaimEntryDataModel as a parameter. However, when I try to assign this object to the RoleClaimEntryDataModel of the class, I receive an error.

Error

Type 'RoleClainEntryDataModel' is not assignable to type 'typeof RoleClaimEntryDataModel'.
Property 'prototype' is missing in type 'RoleClaimEntryDataModel'.

Model Class

export class RoleClaimEntryDataModel{
  roleId:string;
  claimId:string;
  isClaimAssignToRole:boolean;
}

Injectable Service A

@Injectable()
 export class UpdateRoleClaimCommand extends BaseCommand<boolean> {

  public data = RoleClaimEntryDataModel;

  initialise(): void {
      super.setBody(this.data);
  }
}

Injectable Service B

@Injectable()
export class PermissionDataService{

constructor(
    private updateRoleClaimCommand: UpdateRoleClaimCommand
){}

 public UpdateRoleClaimById(roleClaimEntryDataModel: RoleClaimEntryDataModel)
{
    this.updateRoleClaimCommand.data = roleClaimEntryDataModel; // throw error here
}

Answer №1

When dealing with the UpdateRoleClaimCommand, you need to pay attention to the data property which refers to the type RoleClaimEntryDataModel, not an actual variable of type RoleClaimEntryDataModel

Here is the correct implementation:

@Injectable()
 export class UpdateRoleClaimCommand extends BaseCommand<boolean> {

  public data: RoleClaimEntryDataModel;

  initialise(): void {
      super.setBody(this.data);
  }
}

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

Only the final defined document is instantiated by the Swagger-ui-express module

Currently, I am working on a Typescripted nodejs server and facing an issue with defining different swagger paths for separated controllers. The problem is that the swagger-ui-express module only displays the last defined document in the specific route. I ...

Verify the occurrence of an element within an array inside of another array

Here is the scenario: const arr1 = [{id: 1},{id: 2}] const arr2 = [{id: 1},{id: 4},{id: 3}] I need to determine if elements in arr2 are present in arr1 or vice versa. This comparison needs to be done for each element in the array. The expected output sho ...

Oops! We encountered a TypeError at line 57 in the RegisterPage.html file. It seems that there is an issue with reading the property 'valid' of an undefined

An issue is arising while attempting to access a registration page... The error occurs when trying to navigate from the login page to the registration page Error: RegisterPage.html:57 ERROR TypeError: Cannot read property 'valid' of undefined C ...

Exploring the Comma Operator in Typescript

According to information from MDN: The comma operator examines each of its components (working leftward) and gives back the outcome of the last one. To experiment with this, I converted this arrow function: const pushToArray = (a: FormArray, f: FormGr ...

"Utilize ngclass to set CSS classes based on enum string values

Is there a way to directly call an element in Angular when using an enum to organize component styles? Instead of writing multiple ng class expressions or dynamically passing them to the element call. button-types.ts export enum ButtonTypes { Primary ...

Conditional Return Types in a Typescript Function

There is a function that can return two different types, as shown below: function doSomething(obj: {a: string, b?: string}): string | number { if (obj.b) { return 'something' } return 1 } When the function is called with an object cont ...

Problem arises when combining string manipulation and piping operations

I have an HTML code within an Angular 2.0 template that looks like this: <span> Total Employee {{employeeCount> 0 ? '(' + employeeCount+ ')' : ''}} ></span> My customFormatter function is able to take a val ...

Eliminating empty elements from arrays that are nested inside other arrays

I am facing a challenge with the array structure below: const obj = [ { "description": "PCS ", "children": [ null, { "name": "Son", ...

Creating a unique directive in Angular 2 with custom bindings

I have implemented a custom directive in my HTML file which displays different errorType messages for my component, msgfooter: <msgfooter [errorType]="Invalid server"> <msgfooter> or <msgfooter [errorType]="Few Parameters"> <msgfoot ...

Tips for sorting through an array of objects in JavaScript?

I'm currently working on filtering my array within an Angular 4 component. The array includes a property that is also an array: export const data = [ { "number": "1", "lines": [ "aaaaabbbb bbbbb ccccc ddddd", "aaaaabbbb bbbbb cc ...

Issue encountered while executing the "npm run server" directive

The dot '.' is giving an error, saying it is not recognized as an internal or external command, operable program, or batch file. https://i.sstatic.net/CM6OL.png ...

Enhancing Forms with Redux and Styled Components

I'm currently working on developing a reusable component that involves using a redux-form <Field /> and styling it with styled-components within the component. The issue I'm facing is that none of the styles are being applied. Here is my ...

How to Utilize an Array from Observable Object in Angular 2 with ngFor and Async Pipe

I am currently learning about the utilization of Observables in Angular 2. Here is a snippet of code from a service I am working with: import {Injectable, EventEmitter, ViewChild} from '@angular/core'; import {Observable} from "rxjs/Observab ...

The mat-select component in Angular Material is failing to update/refresh when a new value is

Attempting to design an Angular Form for editing a record. When the user navigates to this edit form from the records list page, I aim to populate the fetched record from the API into the form elements while it loads. Utilizing the patchValue method within ...

The CSS properties intended for ion-button elements are not taking effect

I'm attempting to set a background color when a ion-button is clicked or maintain the ion-ripple effect after it has filled the button in Ionic 4. I experimented with applying custom CSS states in global.scss, but encountered issues where the active ...

Improving type checking by extracting constant string values from a union type

I am exploring different types of employees: interface Employee { employeeType: string } interface Manager extends Employee { employeeType: 'MANAGER' // .. etc } interface Developer extends Employee { employeeType: 'DEVELOPER&apos ...

Setting default values in Angular dropdown select using TypeScript

How can a default value be set in a Select element? I am attempting to create a time dropdown select with multiple options. Currently, the selectedTimeOption variable correctly identifies if an option is chosen from the dropdown, but it cannot detect a va ...

Accessing the element reference within a custom attribute directive in Angular through a projected template using ngTemplateOutlet

I'm encountering an issue when trying to adjust the css and click event on a custom attribute directive The DIV causing the problem is nested within a reference that is projected and passed into a child component. Here is the process: Add the ng-te ...

We're sorry, the request was blocked due to a missing Access-Control-Allow-Origin header

Recently, while working on a blog application with the front end in react + typescript and backend in go iris, I encountered an issue when trying to fetch blog content using a get request. The backend was running on localhost:5000 and the node at localhost ...

What are the steps to extract information from an observable?

Having trouble retrieving data from a request? I've encountered an issue where the data retrieved inside .subscribe in an observable function is returning as undefined when trying to access it outside the function. It's quite frustrating! Here i ...