My code includes a class:
import * as p5 from 'p5';
export class Snake{
constructor() { }
sketch = (p: p5) => {
p.setup = () => {
...
}
}
}
To instantiate this class in app.component, I do the following:
import { Component } from '@angular/core';
import { Snake } from './snake';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
snake = new Snake();
}
Next, I pass this instance to my component's template in app.component like so:
<game [snake]=snake ></game>
Within the component, I attempt to use it as shown below:
import { Component, OnInit, Input } from '@angular/core';
import { Snake } from '../snake';
@Component({
selector: 'game',
templateUrl: './game.component.html',
styleUrls: ['./game.component.css']
})
export class GameComponent implements OnInit {
@Input()
public snake: Snake;
constructor() { }
sketch = new p5(this.snake.sketch); // ERROR HERE
ngOnInit(): void { }
}
However, when trying to execute the code, an error is thrown stating
Property 'snake' is used before its initialization.
I am seeking suggestions on how to resolve this issue. Thank you!