refactor: change to host class binding

[yangjunhan]

close #7145

PR Checklist

Please check if your PR fulfills the following requirements:

• The commit message follows our guidelines: https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/CONTRIBUTING.md#commit
• Tests for the changes have been added (for bug fixes / features)
• Docs have been added / updated (for bug fixes / features)

PR Type

What kind of change does this PR introduce?

[ ] Bugfix
[ ] Feature
[ ] Code style update (formatting, local variables)
[x] Refactoring (no functional changes, no api changes)
[ ] Build related changes
[ ] CI related changes
[ ] Documentation content changes
[ ] Application (the showcase website) / infrastructure changes
[ ] Other... Please describe:

What is the current behavior?

Issue Number: 7145

What is the new behavior?

Does this PR introduce a breaking change?

[ ] Yes
[x] No

Other information

[zorro-bot]

This preview will be available after the AzureCI is passed.

[hsuanxyz]

LGTM

[codecov]

Codecov Report

Merging #7148 (364523a) into master (7c11bb1) will decrease coverage by 0.00%.
The diff coverage is 90.24%.

❗ Current head 364523a differs from pull request most recent head 400a909. Consider uploading reports for the commit 400a909 to get more accurate results

@@            Coverage Diff             @@
##           master    #7148      +/-   ##
==========================================
- Coverage   91.68%   91.67%   -0.01%     
==========================================
  Files         486      486              
  Lines       15954    15868      -86     
  Branches     2589     2587       -2     
==========================================
- Hits        14627    14547      -80     
+ Misses       1013     1007       -6     
  Partials      314      314              

Impacted Files	Coverage Δ
components/avatar/avatar.component.ts	100.00% <ø> (ø)
components/badge/badge.component.ts	100.00% <ø> (ø)
components/badge/ribbon.component.ts	33.33% <0.00%> (+3.33%)	⬆️
components/button/button.component.ts	98.57% <ø> (-0.03%)	⬇️
components/card/card.component.ts	92.85% <ø> (-0.48%)	⬇️
components/checkbox/checkbox-group.component.ts	100.00% <ø> (ø)
components/checkbox/checkbox.component.ts	98.43% <ø> (-0.03%)	⬇️
components/collapse/collapse-panel.component.ts	92.59% <ø> (-0.52%)	⬇️
components/collapse/collapse.component.ts	95.00% <ø> (-0.24%)	⬇️
components/grid/row.directive.ts	100.00% <ø> (ø)
... and 55 more

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 7c11bb1...400a909. Read the comment docs.