So, I'm having trouble running jQuery (initializing the materialize tabs component) within a specific component.
For now the code looks like this:
home-logada.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-logada.component.css
.min-90 {
min-height: 83vh;
}
home-logada.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 an idea to solve this problem?