1

Beginner Angular/Javascript question...

In the code example shown below I have a 'value' set to '0'. In the two binding calls for "[checked]" and "(change)" I am setting the method calls to '0'.

<div class="custom-control custom-radio">
        <input type="radio" class="custom-control-input" id="view1" name="taskView" [checked]="isCurrentView(0)" mdbInput value="0" (change)="changeTaskView(0)">
        <label class="custom-control-label" for="view1">Day</label>
</div>

Is it possible to replace the '0' used in the "[checked]" and "(change)" with the tag 'value' property?

user2868835
  • 1,250
  • 3
  • 19
  • 33

2 Answers2

1

You can use Template reference variables (#var) for this.

Use the hash symbol (#) to declare a reference variable. The following reference variable, #taskview, declares a taskview variable on an <input> element.

<input type="radio" #taskview ...>

Now you can refer to a template reference variable anywhere in the component's template. Here, taskview refers to the input element and we can pass its value to an event handler or attribute like:

<input type="radio" #taskview 
   [checked]="isCurrentView(taskview.value)"
   (change)="changeTaskView(taskview.value)">
palaѕн
  • 72,112
  • 17
  • 116
  • 136
  • I've noticed that 'taskview.value' is a string value. In terms of type checking , how can I convert this to a number within the code example you gave above? – user2868835 Jun 24 '20 at 08:16
  • There are multiple ways to do this. All solutions can be found [How to convert a string to an integer in JavaScript?](https://stackoverflow.com/q/1133770) – palaѕн Jun 24 '20 at 16:25
0

Yes, You can provide $event.target.value to the functions.

<input type="radio" class="custom-control-input" id="view1" name="taskView" mdbInput value="0"
  [checked]="isCurrentView($event.target.value)"  
  (change)="changeTaskView($event.target.value)"
>
Kordrad
  • 1,154
  • 7
  • 18