This is web-component using lit

loading spinner

get data form https://cssloaders.github.io/
and https://loading.io/css/

and combine to a component call 

<loading-spinner-element ></loading-spinner-element>

This element have 4 property:
1. name : by default will be spinner1, option spinner1 to spinner11
2. size : size for some loader, default 64px
3. backgroundColor: the color background of the spinner
4. center: to make the spinner in the center of page or not

- ex:
      <loading-spinner-element center name="spinner11" style="color: red;"></loading-spinner-element>
      <loading-spinner-element center name="spinner11" style="color: red;" size="100px"></loading-spinner-element>
      <loading-spinner-element center name="spinner11" style="color: red;" size="100px" backgroundColor="white"></loading-spinner-element>

Integrate

angular

add to angular.json
"architect": {
    "build": {
      "builder": "@angular-devkit/build-angular:browser",
      "options": {
        ...
        ],
        "styles": [
        ],
        "scripts": [

          "./node_modules/lit-litelements/dist/main.js"
        ]
      }
    }
}

html

<script type="module" src="./node_modules/lit-litelements/dist/main.js"></script>