Issue : I created <a class="nav-link" (click)="onOpenModal(null, 'add')">Add Category <span class="sr-only">(current)</span></a>, at html page, I got these Issues. Please Let Me know these Issue. Sincerely

[MrMyatNoe]

[chinthireddy]

I've encountered the same, it's not allowing to give null value.

Error: src/app/app.component.html:9:55 - error TS2345: Argument of type 'null' is not assignable to parameter of type 'Employee'.

[getarrays]

This seems like an issues with the TS config file, doing a strict checking on the template. One way to solve it is to change the tsconfig file and loosen up the rules

[Thomas-P]

Hi,

you has to change the signature of the called method. Loosing up the rules isn't the solution, in this case. TypeScript allows you to use union types on parameters or object attributes. In this way you can determine which type is actually permitted. If you change the signature of the method like this:

interface Demo {
    value: string;
}

const testMethod = (val: Demo | null, type:string) => {

}
  
testMethod(null, 'test');

the parameter can be also set to null. Here is also a link to the TypeScript documentation which covers the mentioned topic.

Best regards

Thomas

[getarrays]

This is another solution that is more suitable in this case, as per Thomas

[zaknafein99]

I made the suggested change:
public onOpenModal(employee: Employee | null, mode: string): void{.....

But, same error:
Error: src/app/app.component.ts:73:7 - error TS2322: Type 'Employee | null' is not assignable to type 'Employee'.
Type 'null' is not assignable to type 'Employee'.

  this.editEmployee = employee;

Did anyone came across this? Solutions?

[zaknafein99]

And with this line:
<a class="nav-link" (click)="onOpenModal(null, 'add')">Add Employee <span class="sr-only">(current)</span></a>
In my case the link is not clickable, any suggestions?

[edna2309]

Try changing the functions parameters like this:
public onOpenModal(mode: string, employee?: Employee | null): void

[Lukkah123]

This worked for me!
Initialize editEmployee with null and undefined in app.components.ts:
public editEmployee: Employee | null | undefined;

and do the same as the first parameter in the method:
public onOpenModal(employee: Employee | null | undefined, mode: string): void{}

In app.component.html:
<a class="nav-link active" (click)="onOpenModal(null, 'add')" aria-current="page" href="#">Add Employee</a>

I hope this works out for you!
Best regards,
Henrik Lukka

[bhattaditya]

This worked for me! Initialize editEmployee with null and undefined in app.components.ts: public editEmployee: Employee | null | undefined;

and do the same as the first parameter in the method: public onOpenModal(employee: Employee | null | undefined, mode: string): void{}

In app.component.html: <a class="nav-link active" (click)="onOpenModal(null, 'add')" aria-current="page" href="#">Add Employee</a>

I hope this works out for you! Best regards, Henrik Lukka

That's worked! Thanks man

[bhattaditya]

Another way - tell the complier that you are not going to receive not null values by postfixing '!'

this.editEmployee = employee!;

[cami-la]

This is another way: "strictNullChecks": false,