Angular 从父对象到子对象的角度传递html属性（即样式/类）

我正在试图找到一种方法，将html属性（如样式和类）从父组件传递到子组件，而无需自定义

@Input（）

值。我看到过一些示例，其中可以传入

尝试使用服务将HTML从父级传递到子级

在属性中存储HTML标记

htmlStr = "<h1> Hey There </h1>";

然后在接收组件中：

import { setHTMLService} from 'src/app/shared/service/setHTML.service';

export class ReceivingComponent implements OnInit {
 htmlExample = '';

constructor(private setHTMLService: setHTMLService) {}
}

ngOnInit() {
      this.htmlExample = this.setHTMLService.getHtmlExample();
}

在模板中：

<div [innerHtml]="htmlExample"><div>

如果要将许多样式传递给一个元素，则可以使用此

<div [styles]=[customStyles]>Child component</div>

子组件

但这不是一个好的做法，因为在这些情况下，最好使用CSS。
我希望避免这种情况，因为我必须为我想要使用的每个html属性创建一个@Input。有没有一种方法可以通过指令来实现这一点？您是指html标记还是html样式属性？两者都可以。例如，如果我想添加一个占位符，我不想更新我的子组件来处理它。我想能够做到这一点，问题是我必须对我想要的每个属性都这样做。我想做的是以某种方式扩展html dom，只需添加我的附加属性：\
<div [styles]=[customStyles]>Child component</div>