如何在 Angular 10 中使用自定义指令设置元素占位符的样式？

问题描述

我有一个使用 Element Ref 和 Renderer 2 来设置元素样式的指令。我想知道如何使用渲染器或此指令中的任何其他方式设置占位符的样式。

代码

TextSizeDirective.ts

import { Directive,ElementRef,Input,OnInit,Renderer2 } from '@angular/core';

import { Service } from '../service';

@Directive({
selector: '[textType]'
})

export class TextSizeDirective implements OnInit {

      @input() textType: string;

      constructor(private el: ElementRef,private s:Service,private renderer: Renderer2) {}

      ngOnInit() {

      this.s.getText().subscribe(data => {

      if (data === 'max' && this.textType === 'title') {

        this.renderer.setStyle(this.el.nativeElement,'font-size','25px');

         //How to style placeholder of this element like above?

      }else if (data === 'max' && this.textType === 'text') {

        this.renderer.setStyle(this.el.nativeElement,'16px');
         //How to style placeholder of this element like above?
      } 
    });
  }
}

AppComponent.html

<div>
<h1 [textType]="'title'">heading</h1>
<p [textType]="'text'">Paragraph</p>
<input [textType]="'text'" type="text" placeholder="Placeholder"/>
</div>

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）