I am faced with a scenario where an input value is received from another component:
<input [value]="myInput.something">
<span (click)="incrementPlus()">+</span>
What I need is a straightforward function that can increment the input value by a specified number each time it's clicked. The challenge here is that the input value is provided through:
@Input() myInput: number;
Without creating multiple variables to store and reuse the value across different inputs, I'm looking for a clean solution.
I could easily modify the @Input within the function, save it in a variable, and then bind the variable to the HTML input value. However, this approach would result in numerous variables being created for each input, which doesn't align with best practices.
This dilemma differs from others I have come across, as they typically involve static value changes or using intermediary variables — something I aim to avoid.