Seznámení s Cheat Sheet Angular 2
Angular 2 je open-source framework, který byl vytvořen přes JavaScript. Používá se hlavně pro vývoj front-end webových aplikací. Je to nástupce AngularJS. Je napsán v TypeScript. Je vyvíjen společností Google. Úhel 2 je postaven na moderním JavaScriptu, který používá ES6. Angular 2 má lepší možnosti zpracování událostí, výkonné šablony, lepší podporu pro mobilní zařízení a webové aplikace pro stolní počítače. Je také kompatibilní s mobilními zařízeními a napříč všemi platformami, jako jsou Windows, Mac a Linux.
Úhel 2 má klíčové funkce pro vývoj aplikací, které jsou komponenty, strojopis a služby. Úhel 2 má různé komponenty, které jsou moduly, komponenty, šablony, metadata a služba. Komponenty pomáhají při vytváření aplikace do mnoha modulů a které pomáhají udržovat aplikaci po delší dobu. Různá sada kódu byla udržována a používána různými moduly aplikace, o které se stará služba. Moduly pomáhají při rozdělení aplikace na logický kus, který je kódován pro provedení konkrétního úkolu.
Příkazy a obsah na úhlové 2 cheat sheet
Angular 2 cheat sheet má rozsáhlou knihovnu, škálovatelnou, rozšiřitelnou, interaktivní a obsahuje mnoho zabudovaných metod pro výpočet běžných operací. Existuje různá syntaxe šablon, NgModules, vestavěných směrnic, formulářů a dalších konfigurací dostupných níže:
Syntaxe šablony | POPIS |
Spojuje vlastnost 'value' s výsledkem výrazu 'name' | |
Spojuje atribut „role“ s výsledkem výrazu „moje role“ | |
Při spuštění události click vyvolá metodu čtení textu. | |
Naváže vlastnost na interpolovaný řetězec | |
Ahoj jmenuji se)) | Naváže kontext na interpolovaný řetězec |
Nastavuje obousměrné vázání. | |
… | * symbol změní aktuální prvek na vloženou temp. |
Student: ((student? .Sname)) | ? je operátor navigace říká, že pole studenta je volitelné |
Vazí šířku vlastnosti stylu a vyjadřuje výsledek mysize. | |
Používá se pro vazbu dat a výraz vázání událostí v šabloně. | |
Č. Vozu: ((číslo vozidla | myCarNuFormat)) | Převádí aktuální hodnotu čísla vozidla pomocí potrubí mycarNuformat. |
To disambiguate prvek z HTML komponenty | |
Vazuje přítomnost třídy na pravý výraz. |
NgModules: - Různé direktivy Ngmodule jsou:
Směrnice | POPIS |
@NgModule ((deklarace ..)) | Definuje modul, který obsahuje směrnice atd. |
deklarace: (MyRedComponent, MyBlueComponent, MyDatePipe) | Řekne seznam komponent, směrnic a potrubí, které patří do tohoto modulu. |
export: (MyRedComponent, MyDatePipe) | Zobrazí seznam komponent a potrubí viditelných pro import tohoto modulu |
import: (BrowserModule, SomeOtherModule) | Zobrazí seznam modulů, které se do tohoto modulu importují |
poskytovatelé: (MyService, (uveďte:…)) | Poskytuje seznam poskytovatelů závislých injekcí viditelných jak pro obsah modulu |
entryComponent: (SomeComponent, OtherComponent) | Poskytne seznam komponent, na které není odkazováno v dostupné šabloně. |
K dispozici jsou další směrnice a detekce změn součástí a háčky životního cyklu, které lze implementovat jako metody třídy:
Směrnice | Popis |
konstruktor (myService: MyService, …) (…) | Používá se k injekčním závislostem. |
ngOnChanges (changeRecord) (…) | Volá se po každé změně vstupních vlastností a před zpracováním obsahu nebo podřízených zobrazení |
ngOnInit () (…) | Nazývá se po konstruktoru a inicializaci vlastností |
ngDoCheck () (…) | Je volána pokaždé, když jsou kontrolovány vlastnosti komponenty nebo direktivy. Používá se k rozšíření o provedení celní kontroly. |
ngAfterContentInit () (…) | Po inicializaci obsahu komponent nebo direktiv se nazývá po ngOninit. |
ngAfterContentChecked () (…) | Volá se po každé kontrole obsahu komponenty nebo směrnice. |
ngAfterViewInit () (…) | Volá se po ngaftercontentint, když byla inicializována směrnice o pohledech na komponenty a podřízené pohledy. |
ngAfterViewChecked () (…) | Je vyvolána po každé kontrole pohledů komponent a podřízených pohledů, ve kterých je směrnice již obsažena. |
ngOnDestroy () (…) | Volá se jednou, než zničí instanci. |
Tipy a triky pro používání příkazů Angular 2 Cheat Sheet: -
- V Angular2 cheat sheet, platformBrowserDynamic (). BootstrapModule (AppModule); pomáhá při zavádění systému pomocí komponenty kořenového adresáře ze zadaného.
- V Angular2, bootstrap: (MyAppComponent) vypíše komponenty, které mají bootstrap, když je tento modul bootstrapován.
- toto je postaveno v direktivě v angualr2 pro odstranění nebo obnovení části Dom stromu na základě výrazu.
- změní prvek seznamu a jeho obsah na šablonu a používá se k vytvoření instance pro každou položku v seznamu.
- „ConditionExpres sion“> Tato směrnice se používá pro výběr šablon na základě hodnoty výrazu nebo jednoduše slovy, jako je přepínač v oops.
- , tyto směrnice vám umožňují přiřadit styl k prvku HTML pomocí CSS a tento CSS může být přímo přístupný.
- tato směrnice váže třídy CSS na prvku k hodnotám důvěryhodných map.
- tato směrnice poskytuje obousměrné závazné, parsovací a validační kontroly formulářů.
- selector: '.cool-button: not (a)' Toto je konfigurace direktivy, která specifikuje selektor CSS, který tuto direktivu identifikuje v šabloně. Nepodporuje výběr nadřazeného dítěte.
- poskytovatelé: (MyService, (uveďte:…)) poskytuje seznam poskytovatelů injekčních závislostí pro směrnici a děti.
- (uveďte: MyService, useClass: MyMockService) nastaví nebo přepíše poskytovatele pro službu do třídy.
- (uveďte: Moje hodnota, použijte hodnotu: 4), nastaví nebo přepíše hodnotu poskytovatele na 4
Závěr - Úhlová 2 cheat sheet
Angular 2 cheat sheet má mnoho funkcí a různých směrnic, moduly jsou k dispozici pro vývoj, který pomáhá při vytváření interaktivnější aplikace pro uživatele a vývojáře ke sledování problémů a funkčnosti. Je rozsáhlý a znovu použitelný pro jiné aplikace. Angular2 používá strojopis, který je zcela odlišný od starší verze AngularJS.
Úhlová podváděcí deska 2 se snáze učí, protože její křivka učení je jednoduchá a přímá pro začátečníky i pro studenty. Znalost JavaScriptu by byla výhodou při použití úhlového vývoje. Vždy je dobré se rekvalifikovat.
Doporučené články
To je průvodce po Angular 2 Cheat sheet zde jsme diskutovali o obsahu a příkaz, stejně jako bezplatné tipy a triky Angular 2 Cheat Sheet. Další informace naleznete také v následujícím článku -
- Cheat list UNIX
- Cheat Sheet HTML
- Cheat Sheet CCNA
- Cheat sheet JQuery