Clever Geek Handbook

AppendHtml () does not add full HTML Dart

The following code works in DartPad as shown in the image below:

void main() {
  Element e = querySelector('table');

  String someValue = 'hello, world';
  int anotherValue = 23958;

  Element row = new Element.tr()
    ..appendHtml('''
      <td>$someValue</td>
      <td>$anotherValue</td>
    ''');

  e.append(row);
}

DartPad

However, when I compile the same code using dart2js ( dart2js -c -o app.js app.dart

) and run it on the same page, the created one is <td>

completely deleted and I end up with:

<table>
  <tr>hello, world 23958</tr>
</table>

The same problem occurs when the actual .dart file is used <script src="...">

with Dartium (v39.0.2171.0 x64). I'm on Dart v1.11.1.

Some testing:

..appendHtml('''
  <td></td>
  <td>hi</td>
''');

Productivity:

<table>
  <tr>hi</tr>
</table>

This gives the same as above:

..appendHtml('<td>hi</td>');

The only way I could get him to give me what I want is this:

..append(new Element.td()..text = someValue)
..append(new Element.td()..text = anotherValue.toString());
+1


source to share


3 answers


Dart 1.11 made changes to appendHTML to sanitize HTML input.

To avoid this, you can pass on a disinfectant that does nothing.



class MySanitizer implements NodeTreeSanitizer {
  void sanitizeTree(Node node) {}
}

document.body.appendHtml('<td>fish</td>', treeSanitizer: new MySanitizer());
+3


source


This is mistake. Should be corrected at the edge of the bleeding very shortly, the correction is in the field of view. Basically, sanitation creates a piece of document for disinfection. This was misusing the context, so it was trying to create it as it was under the body, and the table elements don't work there.



0


source


This is because JS doesn't support multi-line strings, you will need to structure it like this:

'<td>TEXT</td>' +
'<td>TEXT2</td>'

OR

'<td>TEXT</td><td>TEXT2</td>'
-2


source






More articles:


All Articles