Leņķa 2 10 minūtēs

Veids, kādā mēs šodien varam izstrādāt lietojumprogrammas, ir ievērojami samazinājis izstrādes sarežģītību, un, neskatoties uz jaunu tehnoloģiju iekļaušanu, kas sākotnēji var šķist nedaudz sarežģītas, tās faktiski palīdz ne tikai veidot labākas lietojumprogrammas, bet arī pielāgoties pašreizējām lietojamības prasībām.

Viena no šīm tehnoloģijām, ko mēs varam izmantot, ir AngularJS, kas ir MVW ietvars (Modelis-skats-jebkas), kas jums tiek tulkots kā modelis-skats-neatkarīgi no tā, kas darbojas, tas ir balstīts uz JavaScript un ļauj mums nodrošināt savus dokumentus HTML dinamiskās funkcionalitātes statiskās iezīmes un izmantot stiprinājumi ievadīt datus mūsu HTML, izmantojot ietvara direktīvas.

Angular darbojas diezgan labi, taču mums ir jauna iterācija, un tas ļauj daudz vairāk paplašināt ietvara funkcionalitāti, tad redzēsim, kā mēs varam sākt izmantot Angular 2 tikai 10 minūtēs.

1. TypeScript un Angular iegūšana 2

Lai to īstenotu, mēs strādāsim pēc iespējas optimālākā veidā, tāpēc mēs to izmantosim Mašīnraksts kas ir valoda, kas ļauj paplašināt funkcionalitāti JavaScript koncentrēties uz nodarbību un objektu izmantošanu.

Lai iegūtu tik daudz TypeScript Kas Leņķiskais 2 tas ir nepieciešams, lai mums būtu Node.js, kā arī tā pakotņu pārvaldnieku mūsu datorā, ja mums to joprojām nav, varat apskatīt pirmie soļi ar Node.js šajā apmācībā.

Kad mums ir Node.js un iepakojuma pārvaldnieks NPM mēs varam palaist komandas, lai iegūtu nepieciešamo:

 npm install -g tsd@^0.6.0 tsd instalēt angular2 es6-solīt rx rx-lite 

Turklāt mums jāinstalē kompilators TypeScript jo pārlūkprogramma neatpazīst .ts failus:

 npm instalēt -g mašīnraksts@^1.5.0-beta

Kad tas ir izpildīts, mums ar konsoles palīdzību vajadzētu redzēt moduļu, kompilatora un ietvara bibliotēku instalēšanu.

PALIELINĀT

Visbeidzot, mums ir jāinstalē tikai vietējais serveris, lai profesionāli palaistu mūsu lietojumprogrammu, lai to izdarītu mūsu konsolē un caur NPM mēs izpildām sekojošo:

 npm install -g http -serveris

2. Mūsu lietojumprogrammas veidošana

Kad mums ir viss nepieciešamais mūsu lietojumprogrammas darbībai, mēs izveidojam mapi, kurā mums būs projekta faili, un mēs varam to izsaukt leņķiskais 10 min, un iekšpusē mēs izveidosim failu ar nosaukumu pieteikums.ts un mūsu ierastais index.html.

Pirmā lieta, ko mēs darīsim, ir pievienot klases un komponentus mūsu application.ts failam, jo ​​šī ir pirmā lieta, kas mums jādara, ir importēt Leņķiskais 2 sekojoši:

 importēt {Component, View, bootstrap} no 'angular2 / angular2';

Lai pārbaudītu mūsu kompilatora darbību mūsu projekta mapē, mēs veiksim sekojošo:

 tsc --watch -m commonjs -t es5 --emitDecoratorMetadata application.ts

Ar to, ko mums vajadzētu saņemt, izmantojot konsoli, ka kompilācija ir veiksmīgi pabeigta un ka tā arī gaida izmaiņas failā, tas ir, tāpēc, ka ir izmantots parametrs -watch.

PALIELINĀT

Tagad mēs izveidojam savu komponentu, kur mēs paziņosim atlasītājs ko mēs izmantosim savā HTML kodā, kā arī mūsu skatā, kur mēs iekļausim veidni, kurā ievadīsim izmaiņas.

 @Component ({selector: 'my-app'}) @View ({template: ''})

Tā kā mūsu kompilators vēro izmaiņas un mēs esam iekļāvuši dažas izmaiņas, ir normāli, ka mēs savā konsolē redzam kādas darbības.

Tagad mums atliek tikai iesniegt savas klases deklarāciju un inicializēt konstruktora iekšpusē esošos objektus, kas pēc tam tiks iztukšoti skatā. Visbeidzot, mēs izmantojam funkciju bootstrap (), kas būs atbildīga par mūsu lapas komponentu atveidošanu.

 klase myComponent {nosaukums: virkne; konstruktors () {this.name = 'Džonatans'; }} bootstrap (myComponent);

Mūsu mašīnrakstīšanas kods jau ir pabeigts, un, ja mēs pārbaudām savā mapē, mums vajadzētu būt JavaScript, kas ir mūsu .ts apkopošanas rezultāts.

PALIELINĀT

3. HTML veidošana

Visbeidzot, mums ir jāveido HTML, veic pienācīgu importu, kā arī iekļauj atlasītājus, kurus mēs deklarējam savā .ts failā, jo mēs tajā iekļausim system.js, kas ļaus mums veikt importēt no mūsu faila, apskatīsim mūsu HTML saturu:

 Leņķa 2 10 minūtēs 

Kad tas ir izdarīts, mums tikai jāpalaiž mūsu serveris un jāpalaiž mūsu lietojumprogramma, lai to izdarītu, mēs apturējam kompilatoru un izpildām serveri ar šādu komandu:

 http-serveris

Tādējādi tiks iestatīts serveris vietējais saimnieks: 8080 un tas ļaus mums piekļūt mūsu lietojumprogrammai.

Mēs redzēsim mūsu failā definētos datus TypeScript ir tie, kas ir ievadīti mūsu lietojumprogrammā, tādā veidā mēs nošķiram savas lietojumprogrammas loģiku un mums var būt tīrs HTML dokuments, kas apstrādā tikai tos atlasītājus, kurus esam izveidojuši, pateicoties Leņķiskais 2, dodot mums lietojumprogrammu, kas darbojas optimālāk un efektīvāk, izmantojot pēc iespējas mazāk pūļu.