https://wiki.bzz.ch/ 2026-04-07T11:41:00+00:00 https://wiki.bzz.ch/ https://wiki.bzz.ch/_media/wiki/logo.png text/html 2025-02-06T10:34:27+00:00 Anonymous (anonymous@undisclosed.example.com) https://wiki.bzz.ch/en/modul/m291/learningunits/lu05/loesungen/01?rev=1738838067&do=diff LU05.S01 - Vue Directives - Control questions Notes * You are free to use ChatGPT to summarize the content. * Regardless which additional means you use, comrehending the content is crucial to developing your competence. 1. Explain what is meant by the term directives text/html 2025-05-07T14:02:13+00:00 Anonymous (anonymous@undisclosed.example.com) https://wiki.bzz.ch/en/modul/m291/learningunits/lu05/loesungen/02?rev=1746626533&do=diff LU05.S02 - VUE Directives warm up [ ZipFile with the HTML code-solution] Hints * You can download the file and copy the content into the code area of the W3School on the left hand side of the coding window. * You can execute the code by pressing the run button * The result will be presented in the right hand side of the window. text/html 2025-03-28T08:42:03+00:00 Anonymous (anonymous@undisclosed.example.com) https://wiki.bzz.ch/en/modul/m291/learningunits/lu05/loesungen/03?rev=1743151323&do=diff LU05.S03 - v-bind with src Hints * Download the file and copy the content into the code area of the W3School on the left hand side of the coding window. * You can execute the code by pressing the run button * The result will be presented in the right hand side of the window. text/html 2025-03-28T08:47:18+00:00 Anonymous (anonymous@undisclosed.example.com) https://wiki.bzz.ch/en/modul/m291/learningunits/lu05/loesungen/04?rev=1743151638&do=diff LU05.S04 - v-bind with css-class [ Codesolution] Hints * Download the file and copy the content into the code area of the W3School on the left hand side of the coding window. * You can execute the code by pressing the run button * The result will be presented in the right hand side of the window. text/html 2025-05-22T08:02:56+00:00 Anonymous (anonymous@undisclosed.example.com) https://wiki.bzz.ch/en/modul/m291/learningunits/lu05/loesungen/05?rev=1747900976&do=diff LU05.S05 - v-bind with style [ ZipFile with the HTML code-solution] Hints * Download the file and copy the content into the code area of the W3School on the left hand side of the coding window. * You can execute the code by pressing the run button * The result will be presented in the right hand side of the window. text/html 2025-03-28T08:59:36+00:00 Anonymous (anonymous@undisclosed.example.com) https://wiki.bzz.ch/en/modul/m291/learningunits/lu05/loesungen/06?rev=1743152376&do=diff LU05.S06 - v-bind with shorthand Assignment * Open the URL with the exercise, which is given above. * Add to the style-area a new class myClass2 with the background-color: red * Add a new div which incorporates the second style element. * Toggle manually text/html 2025-03-28T06:55:47+00:00 Anonymous (anonymous@undisclosed.example.com) https://wiki.bzz.ch/en/modul/m291/learningunits/lu05/loesungen/07?rev=1743144947&do=diff LU05.S07 - v-if (simple) Sourcecode of the solution [ Sourcecode of the solution] Assignment In the script area of the W3-School example (link above) you will find a variable typewritersInStock with the value true. In the html area of the same script there will be decided, what is supposed to happen in which case. In the text/html 2025-03-27T08:23:27+00:00 Anonymous (anonymous@undisclosed.example.com) https://wiki.bzz.ch/en/modul/m291/learningunits/lu05/loesungen/08?rev=1743063807&do=diff LU05.S08 - v-if with numbers instead of bool Sourcecode of the solution [ Sourcecode of the solution] Assignment The first assignment checked by using v-if whether a certain variable was checked or not (true/false). Now, we want to go one step further and check not only whether it is true or false, but moreover which value it contains. By this, we would be able to tell the customer of how many typewriters we have in stock, which may be of some benefit for the customer as well as for us. text/html 2025-03-28T07:27:04+00:00 Anonymous (anonymous@undisclosed.example.com) https://wiki.bzz.ch/en/modul/m291/learningunits/lu05/loesungen/09?rev=1743146824&do=diff LU05.S09 - v-else-if and v-else Sourcecode of the solution [ Sourcecode of the solution] Assignment * Change the content of the variable typewriter to a value between 0 und 5. Run afterwords the script. * Introduce a additional paragraph with plenty for a stock more than 10. text/html 2025-03-28T09:50:20+00:00 Anonymous (anonymous@undisclosed.example.com) https://wiki.bzz.ch/en/modul/m291/learningunits/lu05/loesungen/10?rev=1743155420&do=diff LU05.S10 - v-if and functions Hints * Download the file and copy the content into the code area of the W3School on the left hand side of the coding window. * You can execute the code by pressing the run button * The result will be presented in the right hand side of the window. text/html 2025-03-28T08:16:17+00:00 Anonymous (anonymous@undisclosed.example.com) https://wiki.bzz.ch/en/modul/m291/learningunits/lu05/loesungen/11?rev=1743149777&do=diff LU05.S11 - v-if, v-else ... combined with AND/OR operators Hints * Download the file and copy the content into the code area of the W3School on the left hand side of the coding window. * You can execute the code by pressing the run button * The result will be presented in the right hand side of the window. text/html 2025-03-28T08:33:17+00:00 Anonymous (anonymous@undisclosed.example.com) https://wiki.bzz.ch/en/modul/m291/learningunits/lu05/loesungen/12?rev=1743150797&do=diff LU05.S12 - v-show simple applied to texts Hints * Download the file and copy the content into the code area of the W3School on the left hand side of the coding window. * You can execute the code by pressing the run button * The result will be presented in the right hand side of the window. text/html 2025-03-28T10:23:50+00:00 Anonymous (anonymous@undisclosed.example.com) https://wiki.bzz.ch/en/modul/m291/learningunits/lu05/loesungen/13?rev=1743157430&do=diff LU05.S13 - v-show simple applied to images Hints * Download the file and copy the content into the code area of the W3School on the left hand side of the coding window. * You can execute the code by pressing the run button * The result will be presented in the right hand side of the window. text/html 2025-03-28T10:36:18+00:00 Anonymous (anonymous@undisclosed.example.com) https://wiki.bzz.ch/en/modul/m291/learningunits/lu05/loesungen/14?rev=1743158178&do=diff LU05.S14 - v-show and v-if combined Hints * Download the file and copy the content into the code area of the W3School on the left hand side of the coding window. * You can execute the code by pressing the run button * The result will be presented in the right hand side of the window. text/html 2025-03-28T10:39:15+00:00 Anonymous (anonymous@undisclosed.example.com) https://wiki.bzz.ch/en/modul/m291/learningunits/lu05/loesungen/15?rev=1743158355&do=diff LU05.S15 - v-for list rendering Hints * Download the file and copy the content into the code area of the W3School on the left hand side of the coding window. * You can execute the code by pressing the run button * The result will be presented in the right hand side of the window. text/html 2025-03-28T11:02:18+00:00 Anonymous (anonymous@undisclosed.example.com) https://wiki.bzz.ch/en/modul/m291/learningunits/lu05/loesungen/16?rev=1743159738&do=diff LU05.S16 - v-for with 2-dimensional arrays Hints * Download the file and copy the content into the code area of the W3School on the left hand side of the coding window. * You can execute the code by pressing the run button * The result will be presented in the right hand side of the window. text/html 2025-03-28T11:12:24+00:00 Anonymous (anonymous@undisclosed.example.com) https://wiki.bzz.ch/en/modul/m291/learningunits/lu05/loesungen/17?rev=1743160344&do=diff LU05.S17 - v-for with 2-dimensional arrays and v-if Hints * Download the file and copy the content into the code area of the W3School on the left hand side of the coding window. * You can execute the code by pressing the run button * The result will be presented in the right hand side of the window. text/html 2025-03-28T11:31:56+00:00 Anonymous (anonymous@undisclosed.example.com) https://wiki.bzz.ch/en/modul/m291/learningunits/lu05/loesungen/18?rev=1743161516&do=diff LU05.S18 - combined usage of several directives Hints * Download the file and copy the content into the code area of the W3School on the left hand side of the coding window. * You can execute the code by pressing the run button * The result will be presented in the right hand side of the window. text/html 2025-05-04T09:03:17+00:00 Anonymous (anonymous@undisclosed.example.com) https://wiki.bzz.ch/en/modul/m291/learningunits/lu05/loesungen/20?rev=1746349397&do=diff LU05.S20 - Knowledge Transfer to Webstorm Assignment * Transfer your solution vom assignment 2 to 18 to transfer * Use a directory structure * 01_v-bind: assignment 2 - 6 * 02_v-if: assignment 7 - 11 * 03_v-show: assignment 12 - 14