render() - function is not updating the DOM - lit-html - lit-html

Question

I have question regarding the lit-html render function.
Currently I have the problem that sometimes the render function does not update the DOM.
My render function looks like this:
public renderLootbag = (_characterItems: Object): void => {
//some other code
const lootbagInventoryTemplate: TemplateResult[] = [];
for (let i: number = 0; i < numberOfInventorySpaces; i++) {
lootbagInventoryTemplate.push(html`
<section class="lootbag__inventoryItem">
//some other code
</section>
`)
};
const lootbagTemplate: TemplateResult = html`
//some other code
<section class="lootbag__inventory">${lootbagInventoryTemplate}
</section>
`;
console.log(lootbagInventoryTemplate);
render(lootbagTemplate, getLootbagContainer);
}
This function gets triggerd everytime I click on a button called "open Lootbag"
Now the problem is: if the value of the parameter in the renderLootbag() function changes, the DOM doesn´t get updated, eventhough the console.log(lootbagInventoryTemplate) shows me the new values ... :/.
img of the console.log
img of the dom
Note: in this case the Element with the class "lootbag__itemData" shouldn´t be filled with content.
Is there a way to completly force a new render?, I have already tried to empty my container with innerHTML and then call the render function but that didn´t work.
Thanks in advance

Answer 1

I had a similar problem with an Input that didnt update all the time.
The undelying problem was that i converted all inputs from the user to number and if the user typed some letters it would fall back to zero.
Since the values didn't change always (zero changed to zero), lit html wouldn't rerender.
The Solution was using a directive.
import { html, render, directive } from "lit-html";
const value = store.savedValueFromInput;
const forceWrite = directive((someValue) => (part) => {
part.setValue(someValue);
});
<input type="number" #change="${setValueFromInput}" .value="${forceWrite(value)}" />
That should force a re-render.
Best regards,
Tristan