htmlangulartypescriptng-bind

How to assign typescript variable to any attribute value?


I have a variable in my typescript file

public variableName: something;

I want to use this variable to replace custom attribute value in html code

<input type="radio" name="someName" id="someId" data-start-time="{{variableName}}" data-end-time="{{variableName}}">

data-start-time and data-end-time as custom attribute and i want their values to be replaced by typescript variable ( Angular) ??


Edit--

Adding More realistic Example--

public selectedWorkOrder: WorkOrder;

workOrder is interface having couple of variables ( eg, ID, title)

<input class="form-check-input" type="radio" name="flexRadioDefault" id="flexRadioDefault1" data-start-time="{{selectedWorkOrder?.window1StartTime}}" data-end-time="{{selectedWorkOrder?.window1endTime}}">
here trying to set object variables to attribute

Thanks in Advance!


Solution

  • You can use the attr modifier.

    <input ... [attr.data-start-time]="selectedWorkOrder?.window1StartTime" [attr.data-end-time]="selectedWorkOrder?.window1endTime" />