How to implement a json template widget in odoo16

a usefull widget for odoo

Some times  we need a dynamic template to show dynamic formated content. not like template widget, template decide by the content, buy not widget template, here is the code.

/** @odoo-module **/

import { useService } from "@web/core/utils/hooks";

import { Component, onMounted, useRef, xml } from "@odoo/owl";
import { registry } from "@web/core/registry";

export class JsonTemplateWidget extends Component {

setup() {

get_template_id() {
if (!this.template_id) {
let template_content = '<p style="color:green">Good Job</p>'
this.template_id = xml`${template_content}`;
return this.template_id;

JsonTemplateWidget.template = xml`
<t t-set="template_id" t-value="get_template_id()"/>
<t t-call="{{template_id}}" />

registry.category("view_widgets").add("json_template_widget", JsonTemplateWidget);
ODOO RPC详解(公开课)