How can i make ngxLoading a reusable component?

Question

enter code hereHi all I have implemented ngxLoading on login page it works fine but i need to use it on other pages too, how can i implement it as a reusable component? Thanks for your help.

 <!-- ngx loading -->
              <div class="form-group">
                <ng-template #customLoadingTemplate>
                  <div class="custom-class">
                    <h5 class="text-center">Loading..</h5>
                  </div>
                </ng-template>

                <ngx-loading
                  [show]="loading"
                  [config]="{ backdropBorderRadius: '20px' }"
                  [template]="customLoadingTemplate"
                ></ngx-loading>
              </div>

enter image description here