Как не обращать внимания на класс начальной загрузки при условии с угловым? - PullRequest
0 голосов
/ 23 ноября 2018

Контекст: мы пытаемся создать приложение компоновщика макетов и хотим посмотреть, как выглядит сетка на планшетах / мобильных / настольных ПК.

<div class="col-sm-3 col-lg-5 col-md-7 black"></div>

Например, если у меня есть такой вид div, и класс пинает в зависимости от размера представления.Так что, если я нахожусь на рабочем столе, что я могу сделать, чтобы игнорировать lg class и показывать sm class, когда я выбираю mobile или наоборот?

PS: я искал вокруг stackoverflow и не смог найти ответ.

Редактировать: Общие ответы: Простой ответ - да, изменить размер браузера, но я не хочу, чтобы пользовательчтобы сделать это, я, как разработчик, знаю об этом, но не технический специалист не будет знать об этом, он / она нажмет на иконку мобильного телефона / планшета, чтобы просмотреть их страницу.

1 Ответ

0 голосов
/ 23 ноября 2018

попробуйте

TS

export class AppComonent implements OnInit {
  wWidth: number;
  wHeight: number;

  constructor(){ }

  ngOnInit() {
    const ele = document.querySelector('.lorem') as HTMLElement;
    ele.addEventListener('click', (e: Event) => {
      this.wWidth = (<HTMLElement>e.target).clientWidth;
      this.wHeight = (<HTMLElement>e.target).clientHeight; // for ex purposes
    });
  }
}

использовать собственный селектор доступа в javascript для доступа к элементу.

HTML

<div [ngClass]="{'col-sm-3': wWidth <= 575, 'col-md-7': (wWidth > 575) && (wWidth <= 992), 'col-lg-5': wWidth > 992  }"></div>

отредактируйте выражение в соответствии с вашими потребностями, просто концепцию, как это реализовать.

...