Custum 属性未在 Angular 14 中设置

Question

自定义属性未在 Angular 14 中设置。之前它适用于 Angular 7。

下面是代码

       <a href="javascript:void(0)" data-idvalue="{{idvalue}}" data-hashvalue=" 
         {{hashvalue}}" data-xvalue="{{xvalue}}"
        data-yvalue="{{yvalue}}" data-titlevalue="{{title}}"
       data-difference="{{difference}}" id="cloudViewShowMore">{{MORE_INFO}}...</a>

可以设置锚标签的Href，但其他自定义属性不绑定。 也尝试过这样的方式

[attr.data-idvalue]="{{idvalue}}"

但没有成功。

Answer 1

我尝试过，可以使用下面的方法设置数据属性，效果很好！下面的工作示例！

import { Component } from '@angular/core';
import { bootstrapApplication } from '@angular/platform-browser';
import 'zone.js';

@Component({
  selector: 'app-root',
  standalone: true,
  template: `
    <a 
    href="javascript:void(0)" 
    [attr.data-id-value]="idvalue" 
    [attr.data-hash-value]="hashvalue" 
    [attr.data-xvalue]="xvalue"
    [attr.data-yvalue]="yvalue" 
    [attr.data-titlevalue]="title"
    [attr.data-difference]="difference" id="cloudViewShowMore">{{MORE_INFO}}...</a>
  `,
})
export class App {
  name = 'Angular';
  idvalue = 'asdf';
  hashvalue = '#WHFEFKSDFLSDFOSDF';
  xvalue = 150;
  yvalue = 350;
  title = 'asdfjnasdfaosd';
  difference = 150;
  MORE_INFO = 'MORE_INFO';
}

bootstrapApplication(App);