Флаттер показывает пространство, когда массив равен нулю [] и стиль не работает

Question

На моем экране данные [index] ['text'] показывают [], когда у них нет значения, но стиль не работает. Как мне показать пространство вместо [], когда его нет?

return ListTile(
     title: Html(data: """<br> """ + data[index]['id'] + ' - ' + data[index]['value'] + ' - ' + """ <span style="color: red"> """ + (data[index]['text']) + """ </b> """ + """ """),
     trailing: Icon(Icons.keyboard_arrow_right),
     onTap: () => Navigator.pushNamed(context, '/approve', arguments:
 data[index]['id'].toString()),
     isThreeLine: false,
     dense: true,
);

Answer 1

Читать о

1) операторы, поддерживающие нуль (альтернативное выражение, если ноль, сокращенное обозначение для троичного оператора)

2) интерполяция строк (чтобы избежать длинных конкатенаций)

Решение:

return ListTile(
  title: Html(
    data: "<br/> ${data[index]['id']} - ${data[index]['value']} - <b>${data[index]['text'] ?? "&nbsp;"}</b>"
  ),
  trailing: Icon(Icons.keyboard_arrow_right),
  onTap: () => Navigator.pushNamed(context, '/approve', arguments:
 data[index]['id'].toString()),
  isThreeLine: false,
  dense: true,
);

Answer 2

return ListTile(
    title: Html(data: """<br> """ + data[index]['id'] + ' - ' + data[index]['value'] + ' - ' + """ <b> """ + (data[index]['text'] != null ? data[index]['text'] : " " )  + """ </b> """ + """ """),
    trailing: Icon(Icons.keyboard_arrow_right),
    onTap: () => Navigator.pushNamed(context, '/approve', arguments:
    data[index]['id'].toString()),
    isThreeLine: false,
    dense: true,
);