Dash app auto update with dcc.Interval not working

Question

I am trying to get my dash dashboard to auto update using Dcc.Interval and Callbacks. I can't figure out what I am doing wrong here. The html.P component "children" are not updating and it doesn't seem like the Interval is bein initiated:

app.layout = html.Div([
# Previous day column
dbc.Col([html.H1(PREV_DAY,
                 style={'textAlign': 'center', 'height': '5%', 'margin-top': '30px', 'margin-bottom': '25px',
                        'font-family': 'Consolas', 'font-size': 'xxx-large'}),
         dbc.Card(
             [
                 dbc.CardBody(
                     [
                        html.H4(id='card_title_1', children=['Sales'], className='card-title'),
                        html.P(id='card_text_1', children=['Sample text.']),
                        dcc.Interval(
                             id='interval-component',
                             interval=10 * 1000,  # in milliseconds
                             n_intervals=0
                         )
                     ], style={'textAlign': 'center', 'font-family': 'Consolas'}
                 )
             ], style={'margin-top': '15px', 'margin-bottom': '15px', 'height': '30%'}
         ),

I am trying to update the html.P(id='card_text_1') element with each interval. Here is my callbacks:

### SECTION - Callbacks ###
@app.callback(
    Output('card_text_1', 'children'),
    Input('interval-component', 'n_intervals'))

def update_metrics(n):
    salesYest = 'test'
    return [{}.format(salesYest)]

Answer 1

If you look at the console where you run the app you will see this error:

AttributeError: 'dict' object has no attribute 'format'

The problem is this part in your callback

return [{}.format(salesYest)]

As the error says a dictionary doesn't have an attribute format.

Now I'm not really sure what you're trying to do exactly in the callback, but the Interval component itself is working fine. You can test this by changing your callback to something like this:

@app.callback(
    Output("card_text_1", "children"), Input("interval-component", "n_intervals")
)
def update_metrics(n):
    return n

Also keep in mind that you have set the interval to 10000 milliseconds. So be sure to check if 10 seconds have actually passed in case it still seems it isn't doing anything or lower the interval when debugging.

Also aside from the format issue you're currently returning the same value every time so you wouldn't notice anything either way.