CODEWITHSUNDEEP
angularjasminekarma-runner
Remi
Remi

Reputation: 5367

Default value for @Input is overwritten by `undefined` in test wrapper

I have the following input on my component:

@Input()
someThing: string = 'm'; // default value

In my test I have defined it as:

@Component({
  selector: 'app-test-wrapper-component',
  template: `
    <app-my-component someThing="someThing" />
  `
})
class TestWrapperComponent {
  someThing; // this needs to be defined, otherwise the template above won't recognize it
}

In this case someThing is undefined. And my component now renders with someThing = undefined.

How can I make sure that the @Input is the default value 'm' in the case of undefined or null?

Upvotes: 0

Views: 604

Answers (1)

Remi
Remi

Reputation: 5367

Ah, got it. Looks like setting it using @Input decorator isn't the way to go, but rather:


export class MyComponent implements Oninit, AfterContentInit {
  private defaultValue: any = 'm';

  @Input()
  someThing: any;

  ngOnInit(): void {
    console.log(this.something || this.defaultValue);
  }

This way, this.something is used when defined, otherwise the fallback is this.defaultValue.

Upvotes: 1

Related Questions