onde colocar meus scripts ou utilizações de js dentro do código de forma correta.

Suponha que eu queira utilizar um exemplo de página de erro já pronto na web e digamos refatora-lo para usar na estrutura do angular, o código em html utilizando o templateUrl funcionou e o css utilizando o styleUrl tbm funcionou, mas fiquei na dúvida sobre onde colocar a parte em javascript, pois o mesmo usa a biblioteca particles.js e possui uma semelhante no angular-particle que pode ser importada. Tentei colocar o código em js no OnInit, porém tive erros, pode parecer meio besta a pergunta, mas já que quase tudo é javascript e typescrip posso estar errando algo bobo. link do exemplo utilizado no teste: https://codepen.io/hellochad/pen/weMpgE

 var particles = {
      "particles": {
        "number": {
          "value": 160,
          "density": {
            "enable": true,
            "value_area": 800
          }
        },
        "color": {
          "value": "#ffffff"
        },
        "shape": {
          "type": "circle",
          "stroke": {
            "width": 0,
            "color": "#000000"
          },
          "polygon": {
            "nb_sides": 5
          },
          "image": {
            "src": "img/github.svg",
            "width": 100,
            "height": 100
          }
        },
        "opacity": {
          "value": 1,
          "random": true,
          "anim": {
            "enable": true,
            "speed": 1,
            "opacity_min": 0,
            "sync": false
          }
        },
        "size": {
          "value": 3,
          "random": true,
          "anim": {
            "enable": false,
            "speed": 4,
            "size_min": 0.3,
            "sync": false
          }
        },
        "line_linked": {
          "enable": false,
          "distance": 150,
          "color": "#ffffff",
          "opacity": 0.4,
          "width": 1
        },
        "move": {
          "enable": true,
          "speed": 0.17,
          "direction": "none",
          "random": true,
          "straight": false,
          "out_mode": "out",
          "bounce": false,
          "attract": {
            "enable": false,
            "rotateX": 600,
            "rotateY": 600
          }
        }
      },
      "interactivity": {
        "detect_on": "canvas",
        "events": {
          "onhover": {
            "enable": false,
            "mode": "bubble"
          },
          "onclick": {
            "enable": false,
            "mode": "repulse"
          },
          "resize": false
        },
        "modes": {
          "grab": {
            "distance": 400,
            "line_linked": {
              "opacity": 1
            }
          },
          "bubble": {
            "distance": 250,
            "size": 0,
            "duration": 2,
            "opacity": 0,
            "speed": 3
          },
          "repulse": {
            "distance": 400,
            "duration": 0.4
          },
          "push": {
            "particles_nb": 4
          },
          "remove": {
            "particles_nb": 2
          }
        }
      },
      "retina_detect": true
   };
   particlesJS('particles-js', particles, function() {
     console.log('callback - particles.js config loaded');
   });