How to set value of checkbox to true using two arrays?

I have two arrays

Array 1 -> ["Drug", "Kerosene", "Petrol"]
Array 2 -> ["Kerosene", "Drug"]

My Array 1 holds all material data & Array 2 is user selected material. So next time when the user opens the form I want the Array 1 to populate as checkbox & set Elements of Array 2 to true (Check Box Checked) which user has selected

How to achieve this in JavaScript / Typescript ?

Any help is highly appreciated.

Thanks in advance. Below is code which populates all checkboxes. I want elements present in array 2 should get checked on load.

<div class="col-md-4" *ngFor="let material of sarr_materialType">
                  <div class="pretty p-svg p-curve" style="font-size:14px">
                    <input type="checkbox" (change)="onSelectMaterialType(material, $event.target.checked)" />
                    <div class="state p-primary">
                      <svg class="svg svg-icon" viewBox="0 0 20 20">
                        <path
                          d="M7.629,14.566c0.125,0.125,0.291,0.188,0.456,0.188c0.164,0,0.329-0.062,0.456-0.188l8.219-8.221c0.252-0.252,0.252-0.659,0-0.911c-0.252-0.252-0.659-0.252-0.911,0l-7.764,7.763L4.152,9.267c-0.252-0.251-0.66-0.251-0.911,0c-0.252,0.252-0.252,0.66,0,0.911L7.629,14.566z"
                          style="stroke: white;fill:white;"></path>
                      </svg>
                      <label> </label>
                    </div>
                  </div>
                </div>