Есть ли способ контролировать html pc и html mobile в одном компоненте? - PullRequest
0 голосов
/ 25 декабря 2018

У меня есть следующий код

import { Component, OnInit } from '@angular/core';
import { mobile } from '../../../../environments/environment';

@Component({
  selector: 'ctk-details-advisory',
  templateUrl: (mobile) ? 'details-advisory.component.mobile.html' : 
'details-advisory.component.html',
 styleUrls: ['./details-advisory.component.scss'],
})
export class DetailsAdvisoryComponent implements OnInit {
// ...

, это помогает мне контролировать различные виды html, ПК и мобильных устройств.проблема в том, что когда я хочу выполнить модульные тесты, я получаю следующую ошибку

Модуль не найден: Ошибка: не удается разрешить '(мобильный)?'details-advisory.component.mobile.html': 'details-advisory.component.html' 'в /home/anonymous/criptoanalisis-0.2/frontend/src/app/pages/advisory/details-advisory' @ ./src / app / pages / advisory / details-advisory / details-advisory.component.ts 23: 22-121

может очень помочь в решении этой проблемы или в другом способе управления различными HTMLправда в том, что я собираюсь хорошо провести время, пытаясь решить проблему, я был бы очень признателен за любое предложение

1 Ответ

0 голосов
/ 25 декабря 2018

Используйте один html (details-advisory.component.html) вместо двух разных шаблонов (один для мобильного отдельно).В коде component определите члена класса

public isMobile = mobile; // imported from the environment in the import section

Затем в HTML-коде template вы можете использовать

<ng-container *ngIf="isMobile; else desktopView">
// all html related to mobile view
</ng-container>

<ng-container #desktopview>
// all html related to desktop view
</ng-container>
...