Angular renderer.setStyle() on renderer2 isn't working

Question

i'm learning Angular, and i have an issue with renderer2, it seems the get is working fine and he gets to the function styleChoice with the right informations but the setStyle isn't working with the ngInit. I tried to await the function but it did not work neither.

Thank you guys for your help.

constructor()

constructor(config: NgbCarouselConfig, private element: ElementRef,
    private renderer: Renderer2, private route: ActivatedRoute) {
      this.gateau = "Gateau au yaourt";
      this.tarteAuPomme = "TarteAuPomme"
      this.gateauMariage = "gateauMariage"
      this.chocolatsFruitRouge = "chocolatsFruitRouge"
      config.interval = 0;
      config.wrap = true;
      config.keyboard = true;
      config.animation = true;
      config.showNavigationIndicators = false;
      this.route.queryParams.subscribe(params => {
        this.choix = params['choix'];
    });

ngOnInit()

  ngOnInit(){
    switch(this.choix){
      case 'gateau':{
        this.styleChoice(document.getElementById('gateau'));
        break;
      }
      case 'tarteAuPomme':{
        this.styleChoice(document.getElementById('tarteAuPomme'));
        break;
      }
      case 'gateauMariage':{
        this.styleChoice(document.getElementById('gateauMariage'));
        break;
      }
      case 'chocolatsFruitRouge':{
        this.styleChoice(document.getElementById('chocolatsFruitRouge'));
        break;
      }
    } 

styleChoice()

styleChoice(element:HTMLElement){
    //this.clean();
    console.log(element)
      this.renderer.setStyle(element, 'boxShadow', "0px 0px 3px 20px rgba(243, 65, 65, 0.8)");
      this.renderer.setStyle(element, 'background', "rgba(243, 65, 65, 0.8)");
      this.renderer.setStyle(element, 'borderRadius', "20px");
    switch(element.id){
      case "gateau" :{
        this.renderer.setProperty(document.getElementById('choix-selection-validation-text'), 'innerHTML', this.gateau)
        break
      }
      case "tarteAuPomme" :{
        this.renderer.setProperty(document.getElementById('choix-selection-validation-text'), 'innerHTML', this.tarteAuPomme)
        break
      }
      case "gateauMariage" :{
        this.renderer.setProperty(document.getElementById('choix-selection-validation-text'), 'innerHTML', this.gateauMariage)
        break
      }
      case "chocolatsFruitRouge" :{
        this.renderer.setProperty(document.getElementById('choix-selection-validation-text'), 'innerHTML', this.chocolatsFruitRouge)
        break
      }
    }

  }

EDIT

  @ViewChild('choiceRef') choiceRef: ElementRef;
  @ViewChild('choiceRef2') choiceRef2: ElementRef;
  @ViewChild('choiceRef3') choiceRef3: ElementRef;
  @ViewChild('choiceRef4') choiceRef4: ElementRef;
  ngAfterViewInit(){
    switch(this.choix){
      case 'gateau':{
        this.renderer.setStyle(this.choiceRef3.nativeElement, 'boxShadow', "0px 0px 3px 20px rgba(243, 65, 65, 0.8)");
        this.renderer.setStyle(this.choiceRef3.nativeElement, 'background', "rgba(243, 65, 65, 0.8)");
        this.renderer.setStyle(this.choiceRef3.nativeElement, 'borderRadius', "20px");
        break;
      }
      case 'tarteAuPomme':{
        this.renderer.setStyle(this.choiceRef2.nativeElement, 'boxShadow', "0px 0px 3px 20px rgba(243, 65, 65, 0.8)");
        this.renderer.setStyle(this.choiceRef2.nativeElement, 'background', "rgba(243, 65, 65, 0.8)");
        this.renderer.setStyle(this.choiceRef2.nativeElement, 'borderRadius', "20px");
        break;
      }
      case 'gateauMariage':{
        this.renderer.setStyle(this.choiceRef.nativeElement, 'boxShadow', "0px 0px 3px 20px rgba(243, 65, 65, 0.8)");
        this.renderer.setStyle(this.choiceRef.nativeElement, 'background', "rgba(243, 65, 65, 0.8)");
        this.renderer.setStyle(this.choiceRef.nativeElement, 'borderRadius', "20px");
        break;
      }
      case 'chocolatsFruitRouge':{
        this.renderer.setStyle(this.choiceRef4.nativeElement, 'boxShadow', "0px 0px 3px 20px rgba(243, 65, 65, 0.8)");
        this.renderer.setStyle(this.choiceRef4.nativeElement, 'background', "rgba(243, 65, 65, 0.8)");
        this.renderer.setStyle(this.choiceRef4.nativeElement, 'borderRadius', "20px");
        break;
      }
    }
  }