Как использовать все классы css или кодировать через переменную?

#angular #ionic-framework #ionic2 #ionic3

#angular #ionic-framework #ionic2 #ionic3

Вопрос:

У меня есть мой css-код в стиле переменной. Я хочу использовать все мои классы через эту переменную. если я напишу свой css-код в виде styles: [ p{color:red} ], то это сработает. но когда я помещаю свой код в переменную, это выдает ошибку «Не удается прочитать стиль свойства undefined».

 @Component({
  selector: 'page-home',
  templateUrl: 'home.html',
  styles: [this.styling]
})
export class HomePage  
{   
    styling='';  pagenm='';
    constructor(public navCtrl: NavController) {} 

    ionViewDidEnter()
    {
       let api = 'myservice.php';
       let params = 'amp;pagenm=' this.pagenm;
       this.homeserv.p_serv().subscribe(data=>{
       this.styling = data.css;  //data.css contains css code  p{color:red} div{color:yellow; font-size:18px;}
       this.dcode = data.html;
       });
    }
}
  

Комментарии:

1. Что data.css содержит? Не могли бы вы, пожалуйста, дополнить свой вопрос этим?

Ответ №1:

Вы не можете получить доступ к свойствам компонента из декоратора его класса.

Что вы могли бы сделать вместо этого, так это заранее определить стиль:

 import { Component } from '@angular/core';

const styling = `p{color:red}`;

@Component({
  selector: 'page-home',
  templateUrl: 'home.html',
  styles: [styling]
})
export class HomePage {   
  constructor(public navCtrl: NavController) {} 
}
  

Демонстрация:https://stackblitz.com/edit/angular-tssxv1

Комментарии:

1. хорошо, теперь это работает. Но у меня есть css-код из моего сервиса. который я вызвал при загрузке моей домашней страницы.

2. Пожалуйста, отредактируйте свой вопрос, указав, что вы на самом деле пытаетесь сделать тогда.