I’m trying to install some conditional fields, but I need a trigger for that. I wanted to use a button-card for that. Preferably the custom one, however I cannot seem to access the entity.state or entity.attributes. I have tried removing all the repo’s from HACS and re-adding them, it didn’t solve the problem. Also my console clogs up with these errors.
Console:
And here the render error:
ButtonCardJSTemplateError: TypeError: Cannot read properties of undefined (reading 'state') in 'var state = entity.state;
if(state == "on")
return `<ha-icon icon="mdi:toggle-switch" style="co...'
Since I couldn’t get it working, I downloaded a different code somewhere, thinking it might have been my error, but apparently it wasn’t.
type: custom:button-card
entity: input_boolean.tutorial
name: Light
show_icon: true
icon: mdi:ceiling-light
tap_action:
action: toggle
state:
- value: 'off'
styles:
card:
- background: black
icon:
- color: white
name:
- color: white
custom_fields:
state:
- color: white
styles:
card:
- padding: 20px 20px 11px 20px
grid:
- grid-template-areas: '"i i" "n n" "state icon"'
- grid-template-columns: 1fr 1fr
- grid-template-rows: 1fr min-content min-content
name:
- justify-self: start
- font-size: 14px
- color: black
- opacity: '0.7'
- padding: 2px 0px
icon:
- width: 24px
- color: black
img_cell:
- justify-self: start
- width: 24px
- height: 24px
- margin-left: '-1px'
- padding-bottom: 18px
custom_fields:
icon:
- justify-self: end
- margin-top: '-9px'
state:
- justify-self: start
- margin-top: '-9px'
- font-size: 16px
- font-weight: 500
custom_fields:
icon: |
[[[
var state = entity.state;
if(state == "on")
return `<ha-icon icon="mdi:toggle-switch" style="color: #59CE8F; width:50px; height:40px;"></ha-icon>`;
else
return `<ha-icon icon="mdi:toggle-switch-off" style="color: var(--contrast1); width:50px; height:40px;"></ha-icon>`;
]]]
state: |
[[[
var state = entity.state
if(state == "on")
return `On`;
else
return `Off`;
]]]
