Мы создаем приложение с Flutter и Dart в качестве университетского проекта и хотим отображать вопросы с несколькими вариантами ответов.Но мы просто получаем очень уродливый смешанный код HTML и JS.Как мы читали в документации, кажется, что нам просто нужно извлечь данные JSON с помощью «html» и вставить их в качестве наших данных в приложение, но у вас будет свой собственный вид, когда я просто скопирую данные здесь.
"<div id=\"q2\" class=\"que multichoice deferredfeedback notyetanswered\"><div class=\"info\"><h3 class=\"no\">Frage <span class=\"qno\">2<\/span><\/h3><div class=\"state\">Bisher nicht beantwortet<\/div><div class=\"grade\">Erreichbare Punkte: 2,00<\/div><div class=\"questionflag editable\" aria-atomic=\"true\" aria-relevant=\"text\" aria-live=\"assertive\"><input type=\"hidden\" name=\"q114:2_:flagged\" value=\"0\" \/><input type=\"checkbox\" id=\"q114:2_:flaggedcheckbox\" name=\"q114:2_:flagged\" value=\"1\" \/><input type=\"hidden\" value=\"qaid=167&qubaid=114&qid=21&slot=2&checksum=7f7e792e2c459f740506b2ecf849c7de&sesskey=eg5u5CdDRB&newstate=\" class=\"questionflagpostdata\" \/><label id=\"q114:2_:flaggedlabel\" for=\"q114:2_:flaggedcheckbox\"><img src=\"https:\/\/es4students.de\/elearning\/theme\/image.php\/boost\/core\/1548933672\/i\/unflagged\" alt=\"nicht markiert\" id=\"q114:2_:flaggedimg\" \/><\/label>\n<\/div><\/div><div class=\"content\"><div class=\"formulation clearfix\"><h4 class=\"accesshide\">Fragetext<\/h4><input type=\"hidden\" name=\"q114:2_:sequencecheck\" value=\"1\" \/><div class=\"qtext\"><p>Nennen sie zentrale Stammdaten des Beschaffungsmoduls.<\/p><\/div><div class=\"ablock\"><div class=\"prompt\">Wählen Sie eine oder mehrere Antworten:<\/div><div class=\"answer\"><div class=\"r0\"><input type=\"hidden\" name=\"q114:2_choice0\" value=\"0\" \/><input type=\"checkbox\" name=\"q114:2_choice0\" value=\"1\" id=\"q114:2_choice0\" \/><label for=\"q114:2_choice0\" class=\"m-l-1\"><span class=\"answernumber\">a. <\/span>Materialstammsatz<\/label> <\/div>\n<div class=\"r1\"><input type=\"hidden\" name=\"q114:2_choice1\" value=\"0\" \/><input type=\"checkbox\" name=\"q114:2_choice1\" value=\"1\" id=\"q114:2_choice1\" \/><label for=\"q114:2_choice1\" class=\"m-l-1\"><span class=\"answernumber\">b. <\/span>Kundenstammsatz<\/label> <\/div>\n<div class=\"r0\"><input type=\"hidden\" name=\"q114:2_choice2\" value=\"0\" \/><input type=\"checkbox\" name=\"q114:2_choice2\" value=\"1\" id=\"q114:2_choice2\" \/><label for=\"q114:2_choice2\" class=\"m-l-1\"><span class=\"answernumber\">c. <\/span>Lieferantenstamm<\/label> <\/div>\n<div class=\"r1\"><input type=\"hidden\" name=\"q114:2_choice3\" value=\"0\" \/><input type=\"checkbox\" name=\"q114:2_choice3\" value=\"1\" id=\"q114:2_choice3\" \/><label for=\"q114:2_choice3\" class=\"m-l-1\"><span class=\"answernumber\">d. <\/span>Einkaufsinfosatz<\/label> <\/div>\n<div class=\"r0\"><input type=\"hidden\" name=\"q114:2_choice4\" value=\"0\" \/><input type=\"checkbox\" name=\"q114:2_choice4\" value=\"1\" id=\"q114:2_choice4\" \/><label for=\"q114:2_choice4\" class=\"m-l-1\"><span class=\"answernumber\">e. <\/span>Beschaffungsstammsatz<\/label> <\/div>\n<div class=\"r1\"><input type=\"hidden\" name=\"q114:2_choice5\" value=\"0\" \/><input type=\"checkbox\" name=\"q114:2_choice5\" value=\"1\" id=\"q114:2_choice5\" \/><label for=\"q114:2_choice5\" class=\"m-l-1\"><span class=\"answernumber\">f. <\/span>Nachrichtenstammsatz<\/label> <\/div>\n<div class=\"r0\"><input type=\"hidden\" name=\"q114:2_choice6\" value=\"0\" \/><input type=\"checkbox\" name=\"q114:2_choice6\" value=\"1\" id=\"q114:2_choice6\" \/><label for=\"q114:2_choice6\" class=\"m-l-1\"><span class=\"answernumber\">g. <\/span>Konditionsstammsatz<\/label> <\/div>\n<div class=\"r1\"><input type=\"hidden\" name=\"q114:2_choice7\" value=\"0\" \/><input type=\"checkbox\" name=\"q114:2_choice7\" value=\"1\" id=\"q114:2_choice7\" \/><label for=\"q114:2_choice7\" class=\"m-l-1\"><span class=\"answernumber\">h. <\/span>Rechnungsstammsatz<\/label> <\/div>\n<\/div><\/div><\/div><\/div><\/div><script type=\"text\/javascript\">\n\/\/<![CDATA[\nvar require = {\n baseUrl : 'https:\/\/es4students.de\/elearning\/lib\/requirejs.php\/1548241441\/',\n \/\/ We only support AMD modules with an explicit define() statement.\n enforceDefine: true,\n skipDataMain: true,\n waitSeconds : 0,\n\n paths: {\n jquery: 'https:\/\/es4students.de\/elearning\/lib\/javascript.php\/1548241441\/lib\/jquery\/jquery-3.2.1.min',\n jqueryui: 'https:\/\/es4students.de\/elearning\/lib\/javascript.php\/1548241441\/lib\/jquery\/ui-1.12.1\/jquery-ui.min',\n jqueryprivate: 'https:\/\/es4students.de\/elearning\/lib\/javascript.php\/1548241441\/lib\/requirejs\/jquery-private'\n },\n\n \/\/ Custom jquery config map.\n map: {\n \/\/ '*' means all modules will get 'jqueryprivate'\n \/\/ for their 'jquery' dependency.\n '*': { jquery: 'jqueryprivate' },\n \/\/ Stub module for 'process'. This is a workaround for a bug in MathJax (see MDL-60458).\n '*': { process: 'core\/first' },\n\n \/\/ 'jquery-private' wants the real jQuery module\n \/\/ though. If this line was not here, there would\n \/\/ be an unresolvable cyclic dependency.\n jqueryprivate: { jquery: 'jquery' }\n }\n};\n\n\/\/]]>\n<\/script>\n<script type=\"text\/javascript\" src=\"https:\/\/es4students.de\/elearning\/lib\/javascript.php\/1548241441\/lib\/requirejs\/require.js\"><\/script>\n<script type=\"text\/javascript\">\n\/\/<![CDATA[\nrequire(['core\/first'], function() {\n;\nrequire([\"media_videojs\/loader\"], function(loader) {\n loader.setUp(function(videojs) {\n videojs.options.flash.swf = \"https:\/\/es4students.de\/elearning\/media\/player\/videojs\/videojs\/video-js.swf\";\nvideojs.addLanguage(\"de\",{\n \"Play\": \"Wiedergabe\",\n \"Pause\": \"Pause\",\n \"Replay\": \"Erneut abspielen\",\n \"Current Time\": \"Aktueller Zeitpunkt\",\n \"Duration Time\": \"Dauer\",\n \"Remaining Time\": \"Verbleibende Zeit\",\n \"Stream Type\": \"Streamtyp\",\n \"LIVE\": \"LIVE\",\n \"Loaded\": \"Geladen\",\n \"Progress\": \"Status\",\n \"Fullscreen\": \"Vollbild\",\n \"Non-Fullscreen\": \"Kein Vollbild\",\n \"Mute\": \"Ton aus\",\n \"Unmute\": \"Ton ein\",\n \"Playback Rate\": \"Wiedergabegeschwindigkeit\",\n \"Subtitles\": \"Untertitel\",\n \"subtitles off\": \"Untertitel aus\",\n \"Captions\": \"Untertitel\",\n \"captions off\": \"Untertitel aus\",\n \"Chapters\": \"Kapitel\",\n \"You aborted the media playback\": \"Sie haben die Videowiedergabe abgebrochen.\",\n \"A network error caused the media download to fail part-way.\": \"Der Videodownload ist aufgrund eines Netzwerkfehlers fehlgeschlagen.\",\n \"The media could not be loaded, either because the server or network failed or because the format is not supported.\": \"Das Video konnte nicht geladen werden, da entweder ein Server- oder Netzwerkfehler auftrat oder das Format nicht unterstützt wird.\",\n \"The media playback was aborted due to a corruption problem or because the media used features your browser did not support.\": \"Die Videowiedergabe wurde entweder wegen eines Problems mit einem beschädigten Video oder wegen verwendeten Funktionen, die vom Browser nicht unterstützt werden, abgebrochen.\",\n \"No compatible source was found for this media.\": \"Für dieses Video wurde keine kompatible Quelle gefunden.\",\n \"Play Video\": \"Video abspielen\",\n \"Close\": \"Schließen\",\n \"Modal Window\": \"Modales Fenster\",\n \"This is a modal window\": \"Dies ist ein modales Fenster\",\n \"This modal can be closed by pressing the Escape key or activating the close button.\": \"Durch Drücken der Esc-Taste bzw. Betätigung der Schaltfläche \\\"Schließen\\\" wird dieses modale Fenster geschlossen.\",\n \", opens captions settings dialog\": \", öffnet Einstellungen für Untertitel\",\n \", opens subtitles settings dialog\": \", öffnet Einstellungen für Untertitel\",\n \", selected\": \", ausgewählt\",\n \"captions settings\": \"Untertiteleinstellungen\",\n \"subtitles settings\": \"Untertiteleinstellungen\",\n \"descriptions settings\": \"Einstellungen für Beschreibungen\",\n \"Close Modal Dialog\": \"Modales Fenster schließen\",\n \"Descriptions\": \"Beschreibungen\",\n \"descriptions off\": \"Beschreibungen aus\",\n \"The media is encrypted and we do not have the keys to decrypt it.\": \"Die Entschlüsselungsschlüssel für den verschlüsselten Medieninhalt sind nicht verfügbar.\",\n \", opens descriptions settings dialog\": \", öffnet Einstellungen für Beschreibungen\",\n \"Audio Track\": \"Tonspur\",\n \"Text\": \"Schrift\",\n \"White\": \"Weiß\",\n \"Black\": \"Schwarz\",\n \"Red\": \"Rot\",\n \"Green\": \"Grün\",\n \"Blue\": \"Blau\",\n \"Yellow\": \"Gelb\",\n \"Magenta\": \"Magenta\",\n \"Cyan\": \"Türkis\",\n \"Background\": \"Hintergrund\",\n \"Window\": \"Fenster\",\n \"Transparent\": \"Durchsichtig\",\n \"Semi-Transparent\": \"Halbdurchsichtig\",\n \"Opaque\": \"Undurchsictig\",\n \"Font Size\": \"Schriftgröße\",\n \"Text Edge Style\": \"Textkantenstil\",\n \"None\": \"Kein\",\n \"Raised\": \"Erhoben\",\n \"Depressed\": \"Gedrückt\",\n \"Uniform\": \"Uniform\",\n \"Dropshadow\": \"Schlagschatten\",\n \"Font Family\": \"Schristfamilie\",\n \"Proportional Sans-Serif\": \"Proportionale Sans-Serif\",\n \"Monospace Sans-Serif\": \"Monospace Sans-Serif\",\n \"Proportional Serif\": \"Proportionale Serif\",\n \"Monospace Serif\": \"Monospace Serif\",\n \"Casual\": \"Zwanglos\",\n \"Script\": \"Schreibeschrift\",\n \"Small Caps\": \"Small-Caps\",\n \"Reset\": \"Zurücksetzen\",\n \"restore all settings to the default values\": \"Alle Einstellungen auf die Standardwerte zurücksetzen\",\n \"Done\": \"Fertig\",\n \"Caption Settings Dialog\": \"Einstellungsdialog für Untertitel\",\n \"Beginning of dialog window. Escape will cancel and close the window.\": \"Anfang des Dialogfensters. Esc bricht ab und schließt das Fenster.\",\n \"End of dialog window.\": \"Ende des Dialogfensters.\",\n \"Audio Player\": \"Audio-Player\",\n \"Video Player\": \"Video-Player\",\n \"Progress Bar\": \"Forschrittsbalken\",\n \"progress bar timing: currentTime={1} duration={2}\": \"{1} von {2}\",\n \"Volume Level\": \"Lautstärkestufe\"\n});\n\n });\n});;\nrequire([\"core\/log\"], function(amd) { amd.setConfig({\"level\":\"trace\"}); });\n});\n\/\/]]>\n<\/script>\n<script type=\"text\/javascript\">\n\/\/<![CDATA[\nM.str = {\"moodle\":{\"lastmodified\":\"Zuletzt ge\\u00e4ndert\",\"name\":\"Name\",\"error\":\"Fehler\",\"info\":\"Informationen\",\"yes\":\"Ja\",\"no\":\"Nein\",\"confirm\":\"Best\\u00e4tigen\",\"areyousure\":\"Sind Sie sicher?\",\"closebuttontitle\":\"Schlie\\u00dfen\",\"unknownerror\":\"Unbekannter Fehler\"},\"repository\":{\"type\":\"Typ\",\"size\":\"Gr\\u00f6\\u00dfe\",\"invalidjson\":\"Ung\\u00fcltiger JSON-Text\",\"nofilesattached\":\"Keine Datei\",\"filepicker\":\"Dateiauswahl\",\"logout\":\"Abmelden\",\"nofilesavailable\":\"Keine Dateien vorhanden\",\"norepositoriesavailable\":\"Keine Ihrer aktuellen Repositories kann Dateien im n\\u00f6tigen Format liefern\",\"fileexistsdialogheader\":\"Datei bereits vorhanden\",\"fileexistsdialog_editor\":\"Eine Datei mit diesem Namen wurde bereits an den Text angeh\\u00e4ngt, den Sie gerade bearbeiten\",\"fileexistsdialog_filemanager\":\"Eine Datei mit diesem Namen wurde bereits an den Text angeh\\u00e4ngt\",\"renameto\":\"Nach '{$a}' umbenennen\",\"referencesexist\":\"{$a} Aliase\\\/Verkn\\u00fcpfungen zu dieser Datei\",\"select\":\"W\\u00e4hlen Sie\"},\"admin\":{\"confirmdeletecomments\":\"M\\u00f6chten Sie die Kommentare wirklich l\\u00f6schen?\"}};\n\/\/]]>\n<\/script>\n<script type=\"text\/javascript\">\n\/\/<![CDATA[\n(function() {Y.use(\"moodle-filter_mathjaxloader-loader\",function() {M.filter_mathjaxloader.configure({\"mathjaxconfig\":\"\\nMathJax.Hub.Config({\\n config: [\\\"Accessible.js\\\", \\\"Safe.js\\\"],\\n errorSettings: { message: [\\\"!\\\"] },\\n skipStartupTypeset: true,\\n messageStyle: \\\"none\\\"\\n});\\n\",\"lang\":\"de\"});\n});\n M.util.js_pending('random5cd9916fbedba1'); Y.on('domready', function() { M.util.js_complete(\"init\"); M.util.js_complete('random5cd9916fbedba1'); });\n})();\n\/\/]]>\n<\/script>\n"
Извините за это форматирование.Просто прокрутите немного.Вы видите, что это проводное.Когда я удалил все \, HTML выглядел намного лучше и работал, но потом яваскрипт был сломан и все равно \n.
Что мы можем сделать?Это ужасно, что мы получаем от API Moodle.