我有一个角度分量,我在其中使用def更改电池svg状态填充。
.boxes {
display: flex;
flex-wrap: wrap;
}
.box {
margin: 0 1% 1% 0;
width: 48%;
}
如果我有该组件的单个实例,则可以正常工作。如果我有多个具有不同“值”值的组件,则所有组件都将显示第一个组件的填充。
不确定我在哪里弄错了
类似的问题:Updating offsets dynamically
PS:我实际上对电池图标有很长的路要走。.某种程度上,Stackoverflow并不接受很长的路。这就是我用rect替换路径的原因。如果它是矩形,我可以更改它的高度来实现我所需要的:)
答案 0 :(得分:2)
问题在于$('#tbl-boiler').mDatatable({
data: {
type: 'remote',
source: {
read: {
url: '/Company/GetBoilers/' + siteId,
}
},
},
sortable: false,
pagination: false,
rows: { autoHide: true },
columns: [
{
field: 'site_id',
title: 'site_id',
visible: false
},
{
field: 'kazan_id',
title: 'kazan_id',
visible: false
},
{
field: 'boyler_id',
title: 'boyler_id',
visible: false
},
{
field: 'okuma_ucreti',
title: 'Okuma Ücreti',
width: 100
},
{
field: 'kazan_no',
title: 'Kazan Numarası',
width: 120
},
{
field: 'kazan_sayac_no',
title: 'Kazan Sayaç Numarası',
width: 165
},
{
field: 'boyler_no',
title: 'Boyler Numarası',
width: 120
},
{
field: 'boyler_sayac_no',
title: 'Boyler Sayaç Numarası',
width: 170
},
{
field: 'blok_sayisi',
title: 'Bloklar',
width: 250
},
{
field: 'daire_sayisi',
title: 'Daireler',
width: 250
},
{
field: 'sayac_sayisi',
title: 'Sayaclar',
width: 250
},
{
field: 'actions',
title: 'İşlemler',
sortable: !1,
overflow: 'visible',
template: function (t) {
return '<a data-toggle="modal" data-target="#siteform" onclick="getBoiler(' + t.kazan_id + ');" class="edit-site m-portlet__nav-link btn m-btn m-btn--hover-accent m-btn--icon m-btn--icon-only m-btn--pill" title="Kazan Bilgilerini Düzenle">' +
'<i class="la la-edit"></i>' +
'</a>' +
'<a onclick="deleteBoiler(' + t.kazan_id + ')" class="m-portlet__nav-link btn m-btn m-btn--hover-danger m-btn--icon m-btn--icon-only m-btn--pill" title="Kazanı Sil">' +
'<i class="la la-trash"></i>' +
'</a>';
},
width: 250
}
]
});
元素都具有相同的linearGradient
,即id
。您可以使每个batteryLG
唯一,从而允许每个形状引用其自己的渐变。实现此目的的一种方法是在组件类中定义一个id
计数器,为每个实例增加它的值,并将其值包括在组件的static
属性中:
batteryLinearGradientId
然后可以将该属性绑定到模板中的export class MySvgComponent {
@Input() value: number;
private static counter = 0;
batteryLinearGradientId = "batteryLinearGradient_" + MySvgComponent.counter++;
}
,并在rect id
属性的URL中进行引用:
fill
有关演示,请参见this stackblitz。请注意,我修改了渐变色标的定义,以简化演示。