Несколько вкладок с материализацией следующего (V1)?

Я не могу использовать несколько вкладок на одной странице при использовании materialize v1 и angular.

Это мой app.component.ts:

`

/* import { Component } from '@angular/core'; */
import { Component, OnInit } from '@angular/core';
import 'materialize-css';
declare var M: any;

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit{
  title = 'app';

  ngOnInit() {
    const instanceSidenav = new M.Sidenav(document.querySelector('.sidenav'));
    const instanceTab = new M.Tabs(document.querySelector('.tabs'));
  }
}

`

И боковое меню работает, и даже первая вкладка на странице работает, а вторая не работает. Я превратил первое во второе, и то же самое происходит с новыми вторыми вкладками.

Что я могу делать без jquery?


materialize angular5
person judasane    schedule 03.01.2018    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Я нашел способ заставить его работать: вместо того, чтобы инициализировать вкладки официальным способом документации, который использует селектор классов внутри document.querySelector('.tabs'), я использовал селекторы идентификаторов таким образом document.querySelector('#tab1').

Это работало для меня, пока я не подумал, что проблема требует лучшего подхода.

person judasane    schedule 04.01.2018