How to use jQuery inside component - Angular

Question

So I’m having trouble executing jQuery (initialize the tabs component of materialize) within a specific component.

For now the code is like this:

home-logged.component.html

<div class="row">

<ul id="tabs-swipe-demo" class="tabs">
<li class="tab col s4"><a class="green-text text-accent-3 grey darken-4" href="#test-swipe-1">bring2me</a></li>
<li class="tab col s4"><a class="green-text text-accent-3 grey darken-4" href="#test-swipe-2">bring2someone</a></li>
<li class="tab col s4"><a class="green-text text-accent-3 grey darken-4" href="#test-swipe-3">perfil</a></li>
</ul>

<div id="test-swipe-1" class="min-90 col s12 white grey-text text-darken-4"></div>
<div id="test-swipe-2" class="min-90 col s12 white grey-text text-darken-4"></div>
<div id="test-swipe-3" class="min-90 col s12 white grey-text text-darken-4"></div>    

</div>

home-logged.component.css

.min-90 {
    min-height: 83vh;
}

home-logged.component.ts

import { Component, OnInit, AfterViewInit } from '@angular/core';
import * as $ from "jquery";

@Component({
    selector: 'app-home-logada',
    templateUrl: './home-logada.component.html',
    styleUrls: ['./home-logada.component.css']
})

export class HomeLogadaComponent implements AfterViewInit {

    constructor() { }

    ngOnInit() {
    }

    ngAfterViewInit() {
        $('.tabs').tabs();
    }

}

Does anyone have any idea how to solve this problem?