Angular-muotoilija
Muotoile Angular-komponenttien mallit tällä Angular-muotoilijalla. Liitä mallin HTML-koodi rakenteellisine direktiiveineen, sidontoineen ja interpolointeineen, niin työkalu asettaa lohkoelementit, kuten div, section, p, ul ja table, omille riveilleen kahden välilyönnin sisennyksellä, tiivistää ylimääräiset tyhjätilat sekä muotoilee sisäiset script- ja style-lohkot. Direktiivit, sidonnat ja lausekkeet säilyvät täsmälleen sellaisina kuin ne on kirjoitettu, joten Angular-kehittäjät saavat siistit mallit nopeasti.
Usein kysytyt kysymykset
Mitä voin muotoilla Angular-muotoilijalla?
Se muotoilee Angular-komponenttien malleja eli HTML-koodia, jota kirjoitat .component.html-tiedostoihin tai mallimerkkijonoon. TypeScript-komponenttiluokkia ei käsitellä tässä; käytä niihin TypeScript-muotoilijaa.
Säilyvätkö direktiivit ja sidonnat?
Kyllä. Attribuutit, kuten *ngIf, *ngFor, [value], (click) ja [(ngModel)], sekä interpoloinnit, kuten {{ user.name }}, kopioidaan täsmälleen sellaisina kuin ne on kirjoitettu. Vain elementtien väliset tyhjätilat muuttuvat.
Mitkä elementit asetetaan omille riveilleen?
Kun elementissä on lohkotason lapsielementtejä, kuten div, section, article, header, footer, nav, main, form, p, h1–h6, ul, ol tai table, kukin lapsielementti sijoitetaan omalle sisennetylle rivilleen. Elementit, joissa ei ole tällaisia lapsielementtejä, pysyvät yhdellä rivillä, ja peräkkäiset tyhjätilat tiivistetään yksittäisiksi välilyönneiksi.
Miksi mukautettu komponenttini pysyy yhdellä rivillä?
Mukautetut elementit, kuten app-root tai mat-card, eivät ole lohkotason HTML-elementtejä, joten niiden sisältö pysyy samalla rivillä, ellei se sisällä lohkoelementtiä, kuten div tai p. Jos haluat sisällön asettuvan usealle riville, kääri se lohkoelementtiin.
Asetetaanko luettelokohteet eri riveille?
Eivät itsenäisesti: li ei ole lohkotason tunniste, joten ul, jonka ainoat lapsielementit ovat li-elementtejä, pysyy yhdellä rivillä. Lisää kohteisiin lohkosisältöä, kuten div, jotta ne asettuvat usealle riville.
Mitä script- ja style-tunnisteille tapahtuu?
Sisäiset style-lohkot muotoillaan muodossa CSS ja sisäiset script-lohkot muodossa JavaScript, sisennettyinä tunnisteidensä alle. pre- ja textarea-elementtien sisältö säilyy täsmälleen sellaisena kuin se on kirjoitettu.
Säilyvätkö HTML-kommentit?
Kyllä. HTML-kommentit säilytetään ja sijoitetaan omalle rivilleen laajennettujen elementtien sisällä. Niiden sisältö kopioidaan täsmälleen, joten kommentoidut merkinnät säilyvät ennallaan.
Tarkistaako se mallini?
Ei. Se ei käännä mallia eikä tarkista sitä, ja sulkemattomat tunnisteet muotoillaan parhaalla mahdollisella tavalla. Etsi mallivirheitä komennolla ng build tai editorisi Angular-kielipalvelulla.
Miksi tuloste on rajattu html-koodilohkoon?
Angular-mallit ovat HTML, joten tulos palautetaan Markdown-koodilohkona, jonka merkintä on html. Kopioi aitausten väliset rivit mallitiedostoosi.
Kuinka suuri mallini voi olla?
Enintään 5 MB suoritusta kohden; suurempi syöte hylätään ja siitä näytetään viesti. Tuloste on sama kuin Code Formatterin Angular-vaihtoehdolla.