così ciao a tutti il mio nome è roderick e
sono un membro del team di base angolare
e in realtà volevo iniziare il
presentazione con qualcosa un po ‘
prova speciale a svegliarti un po ‘così
voluto mostrare bene in realtà quando ho
quando Carmen mi ha invitato a questo discorso lei
mi ha detto di non esitare a fare cose folli
quindi una cosa che voglio mostrarti è una
dei miei hobby che sono un mago
quindi non sono un professionista ma è ancora
piuttosto divertente soprattutto da noi
dire che l’angolare è un supereroe è
è pertinente, quindi ho rotto questo
scusa, quindi ne proverò un’altra
aspetta, ho un mazzo di carte con me
quindi signore, ti dispiacerebbe dirmi basta
ogni volta che ti va bene così andiamo
guarda la carta così la tua carta è la 9
di picche questo è interessante perché se
guardi il sito web angolare di Taio e
guarda il doctype lo troverai
la tua carta è proprio lì
in modo che mi porti al mio argomento che è
angolare 2 quindi se non hai sentito
su angular 2 è la prossima versione di
angolare e il suo sito web è taio angolare
quindi cambiamo da angularjs a angularjs
punto org a taio angolare quindi è qui
troverai altre risorse per i ricercatori
per l’angolare 2 tutto bene così attualmente
angular 2 è in Developer Preview quindi io
vuoi vederne l’anteprima
sviluppatori e per questo ho una demo così
è un’applicazione in cui è scritto
angolare 2 quindi cosa fa l’applicazione
abbiamo solo i quartieri in
Amsterdam e puoi segnalare l’importo
di turisti in un viaggio che vedi in a
dato quartiere e si propaga a
l’altro browser quindi se vi state chiedendo
cosa intendo per turisti in viaggio
non deve necessariamente essere un buono
viaggio potrebbe essere un brutto viaggio da quando siamo
ad Amsterdam, questo è questo
l’applicazione ha un paio di componenti
di cose interessanti in esso piace dove siamo noi
abbiamo la gestione della collezione che abbiamo
componenti in esso abbiamo integrazione
con le prese del forum quindi per questo
presentazione Io dico costruiamolo facciamo
costruiscilo insieme in modo che non sia vivo
codificandolo verrà registrato il codice in tempo reale
quindi spero di non poter incasinare così è
perché è registrato così sarà prima
iniziare costruendolo in angolare 2 e
dattiloscritto che è il linguaggio che
Angular 2 è scritto in e parleremo
a questo un po ‘di più e poi a
scopi di apprendimento che stiamo per convertire
a acma strip 5 quindi ancora angolare 2
ma il senape al collo 5 così puoi vedere
la differenza e poi andremo un po ‘
più pazzo e convertirlo in angolare 1
durante questo discorso quindi se lo sei
chiedendosi che dattiloscritto è solo un
superset di es6 che è il prossimo
versione di JavaScript e ha appena
tipi e annotazioni aggiunte
onestamente potremmo fare un intero discorso su es6
è molto eccitante ma questo è il
traccia di angularjs e se lo facessimo quando
voi gente iniziereste a ballare
eccitazione che è grande, tranne che sarò
incluso, quindi non va bene per il discorso
e anche se pensi che echamos se
sei è qualcosa nel futuro che è
non qui ancora bene i miei amici siamo noi
arrivare a quel futuro se guardi
il supporto del browser Firefox ha già
sessantasei per cento delle caratteristiche dell’Essex
cromo 45 per cento e la versione bordo
di IE che arriverà anche in Windows 10
ha il 63% rispetto ad alcuni
le bandiere vanno bene quindi iniziamo con
costruendo la nostra appt la stessa app che
Ho appena dimostrato che prima abbiamo bisogno del codice
base di angolare 2 e per scoprire che noi
puoi andare su codice angularjs org lo farai
trova tutte le build di angular 2 così e
vorremmo i due punti zero punto zero
alpha quindi se si fa clic su che vedrete
quello sarà finito e una cartella che ha
tutte le build useranno il dev
questo ci darà migliori messaggi di errore
e questo sarebbe scritto in Natale
viaggio di sei moduli e quando andremo a
convertirlo in un concerto a cinque stiamo andando
usare la versione sfx che mette le cose
nella portata globale va bene così andiamo
inizia a scrivere per prima cosa, quindi avremo
il nostro tag script che include angular 2
e dal momento che ho detto che siamo in un fumetto
sei moduli che dovremo fare
include i sistemi a / s che è una libreria
così carica tutti i tipi di moduli
JSA e D comuni e così via compresi
sei uguali quindi useremo questo e
dal momento che questa è una demo vera e io no
voglio nascondere le parti brutte che abbiamo anche noi
una dipendenza dal tracciante sulla traccia per
runtime perché parte dell’angolare 2
la base di codice è ancora compilata con randagi
signore, non è tutto convertito in questo
script ancora così ma sarà rimosso
nel prossimo futuro e giusto e da allora
vogliamo che vogliamo che questo appaia bene
in realtà include anche il bootstrap con a
tema per farlo sembrare Google
design dei materiali quindi dopo anche noi
ho bisogno di socket I / O perché useremo
prese e calzino che ero un po ‘il
la migliore soluzione e ora quando si tratta di
dattiloscritto abbiamo anche bisogno di includere il
file di definizione delle nostre librerie di venditori
quindi dal momento che stiamo includendo solo il jas
costruito quale è il
risultato della compilation che dattiloscritto
e vogliamo che il typescript faccia tipo
il controllo includerà la definizione
file che indica solo i tipi di
compilatore che questa classe ha questi
proprietà e così via così che cosa questo
fare è una cartella chiamata digitazione bene
troverai tutti i Taiping e un file
che fa riferimento a tutti loro così nel nostro
l’app farà solo riferimento a questo file e
quindi il compilatore sa come fare è
tipo di controllo e così via ultima cosa per
dattiloscritto è anche necessario dargliene alcuni
parametri sì, ne abbiamo alcuni per alcuni
configurazione per il nostro compilatore di messaggi
semplicemente vendendolo per compilare 2s 5s per
esempio invece di es6 e possiamo iniziare
sviluppando la nostra prima componente angolare
quindi un componente è solo una classe e io
Non può fare un passo 6 classe sarà chiamando
l’app tour stripping farà riferimento
quel file di definizione che abbiamo menzionato
quindi dopo possiamo importare le cose da
il componente angolare 2 come componente e
l’annotazione della vista e anche un bootstrap
funzione per avviare la nostra app che siamo
dovremo annotare la nostra classe a
dire angolare che questo è un componente
e gli daremo un selettore quindi un CSS
selettore che quando angolare troverà un
elemento che corrisponde al selezionatore
istanziare questo componente e anche
diciamo che diciamo che questo componente
ha una vista con un URL modello in modo che
il modello sarà iniettato nel Dom
ogni volta che angolare lo troverà
componente nell’HTML così così ora nel nostro
indice di HTML possiamo fare riferimento al nostro nostro
componente e importa il nostro modulo perché
siamo in striscia ECMO sei useranno
sistemi sì e finalmente prima che possiamo
in realtà aprirlo nel nostro browser reale
avviare il componente utilizzando il
funzione di bootstrap dandogli solo il
funzione componente ben classe esegui il nostro
compilatore dattiloscritto utilizzando molta modalità così
continua a compilare esegui il nostro server HTTP
e quindi possiamo aprire il nostro browser e vedere
funziona così ce l’abbiamo sulla porta 8080
quindi abbiamo ottenuto l’angolatura base da impostare
con il compilatore dattiloscritto così ora siamo noi
può iniziare a sviluppare la nostra app in modo giusto
l’ultima cosa saranno i tipi di compilatore
uscita in file JS ma ovviamente lo saremo
funziona con il file di foglio che vedi
è proprio accanto al lato del teatro per
il file di script di tipo nel file
la configurazione si può cambiare a
un’altra directory ma per questo sarà solo
mantienila semplice così ora inizia
pensare alla nostra app ci piace davvero
ingegnerizzare la nostra app abbiamo questo modello
chiamato quartiere e questo modello
avrà un nome e il turista trippino
ammontare come la quantità di turisti che
stanno inciampando in quel quartiere e a
gestire quel modello avrà un servizio
chiamerà il gestore del quartiere
perché siamo fantastici con i nomi e così via
questi sono solo sei classi di fumetti
quindi ho una cartella di servizio con a
cartella del gestore di quartiere e il mio
modello di quartiere nascosto quindi è di nuovo
è solo una classe che stiamo esportando
che ha due proprietà che sono le
titolo e l’importo e anche noi semplicemente
avere un costruttore che prende questi due
parametri e metterli sulla classe così
notare che tutto qui è collegato a
digitando è dattiloscritto specifico ma il
classificare il costruttore come predefinito
parametro tutti i nostri natale onorano tutti gli ECMO
spoglia sei, quindi è abbastanza carino anche noi
avere un metodo impostato come quantità TT come il
aiutante che parsefloat il valore nel caso
è stato dato come una stringa, quindi siamo noi
sappiamo che lavoriamo sempre con i numeri
e pensando a questo proprio ora noi
potrebbe avere avuto una proprietà satyr invece
di un metodo immagino di essere un peer reviewing
io stesso qui ma per ora quello
lo farà e quindi per il nostro servizio è
anche solo una classe che importerà il
modello di quartiere con ECMO sip six
moduli e dal momento che il nostro servizio è
fondamentalmente gestendo una collezione di
quartieri avrà a
array di quartiere su di esso così il
la collezione è solo ariosa e ora in
i nostri componenti possiamo importare i nostri
gestore di quartiere e iniziare a usarlo
quindi dobbiamo dire angolare per fare
angular 2 consapevole del servizio così per
che usiamo l’app injector che così
che l’effettiva iniezione di dipendenza
potrebbe accadere nel nostro costruttore così ora
il servizio verrà creato nel
contesto di questo componente e vogliamo
il nostro componente per avere un riferimento a
questa collezione di quartieri così
lo assegneremo semplicemente dal servizio così
ora possiamo andare al nostro cambio di file HTML
il modello da funziona a un effettivo
bella intestazione e inizia a scorrere il
collezione di quartiere che è nella nostra
componente che utilizza energia per simili a
ng-ripeti solo leggermente diversi
sintassi e vorrà anche produrre il nostro
nome del quartiere e importo solo per
scopi di test per ora e da noi
anche bisogno di renderlo spigoloso consapevole di ciò
useremo questa energia per
direttiva quindi lo noterete in e
in Angular 2 non esiste un registro globale
di cose come servizi e direttive
e le direttive che devi dire angolare
esplicitamente che userete
queste direttive e servizi ed è a
un po ‘ più dichiarativo e aiuta con grande
applicazioni così ora prima che possiamo aprire
questo nel nostro browser noterà che il nostro
la raccolta di quartiere è in realtà
vuoto quindi riempiamolo e per farlo
Ho intenzione di utilizzare un design simile al
Eric che spinge il metodo integrato
JavaScript quindi se guardi la sintassi
push in realtà può prendere più elementi
e verranno tutti aggiunti all’array
alcune persone non lo sanno così tanto se
hai più elementi che non hai
devi chiamare push più volte che puoi
chiamalo una volta con più argomenti così
facciamo qualcosa di simile nella nostra app così via
il nostro servizio avrà un metodo chiamato
spingere il quartiere che prende i nomi
del quartiere e che creerà
l’oggetto del vicinato quindi notalo
qui ogni nome di quartiere è un
argomento diverso per la funzione così
solo per mostrare il consiglio di Aikman 6
caratteristica è quando implementiamo questo nel nostro
servizio possiamo usare i parametri di riposo quindi se
non hai familiarità con il resto
i parametri sono immagini di avere un
funzione che accetta un parametro a B e
quindi arrestare il parametro quel parametro
raccoglierà tutti gli argomenti dati a
la funzione
bruciato nel bruciato definito così nel nostro
caso abbiamo solo un parametro di riposo e
così prenderà tutti gli argomenti e
mettili in un Eric e poi mapperemo
per il nostro oggetto di quartiere che usa
funzioni di freccia grossa che restituiscono il
ultima affermazione che era nella funzione
e inoltre persistono questo dal
contesto esterno quindi per spingerlo al nostro
l’area utilizzerà effettivamente push con
spargere operatore così che la diffusione
l’operatore fa è dato un array
è passato a una funzione che sarà
in realtà espanderlo in modo che diventi
più argomenti per quella funzione così
qui è come se passassimo di più
argomenti per la funzione push e noi siamo
facendo ciò invece di concatenare
perché concatenato in costruzione nuovo
array e non vogliamo che noi solo
voglio modificare il nostro attuale arioso così
è un suggerimento eche piuttosto carino 6
funzioni così ora se andiamo sul nostro browser
e rinfresciamo possiamo vedere che possiamo vedere
i nomi e l’importo almeno posso
vederli, non so se puoi, si
di nuovo guardando questo codice non lo so
se così fosse la prossima versione di java
lo script che conosci digita le classi
questo tipo di script ma costruttore e così via
caratteristiche molto pulite a mio parere così ora
Torniamo a pensare la nostra app
quindi vogliamo riportare la quantità di
persone in ogni quartiere, quindi siamo
andando a creare un componente chiamato
le persone contano in modo che sembrino un po ‘
così e come vogliamo invocarlo
sta usando un elemento chiamato numero di persone
con il titolo e una somma quindi facciamolo
inizia a creare bene il nostro componente
college completo nel nostro modello di app così noi
avere il titolo e l’importo e
saranno equivalenti al
Nome quartiere e l’importo sarà
l’importo TT nel quartiere da allora
vogliamo questo vogliamo che ci sia vincolante
tra questa espressione e la proprietà
sul componente dovrà effettivamente
Mettilo nella notazione delle parentesi così che cosa
significa che questo dice angolare che il
il valore è un’espressione di rabbia che
dovrebbe essere valutato e legato al
componente così altrimenti è solo un
Attributo HTML quindi possiamo avere il nostro
il nostro componente che ha due proprietà
titolo e importo
e può dovremo importare il
componente e la vista per specificarlo
angolare che questo è un componente e
qual è la sua opinione, così sarà la componente
avere un selettore chiamato gente conta se
avrai un modello che è giusto
adiacente al componente giusto
quindi la prossima cosa che devi effettivamente dire
angolare che questo componente ne richiede due
proprietà che sono titolo e importo così
poi angolare farà il legame tra
l’HTML e la proprietà su questa classe
e guardando questo potrebbe esserci
confusione con il titolo forse alcune persone
chi pensa che sia in un attributo HTML nativo
quindi parliamo solo del fornitore
prefisso e lo chiameremo TT quindi qui
stiamo dicendo di impostare angolare che noi
vuoi che il titolo sia chiamato titolo sul
componente ma volevamo il titolo TT nel
HTML quindi ora non c’è confusione
questo va al componente conta persone
quindi possiamo andare nel nostro avvio HTML
riecheggiando queste attraverso le proprietà e io
volevo solo smetterla di fartelo sapere
un 2 angolare se si commettono errori e
espressioni si otterrà effettivamente un errore
farà un errore mentre un
angolare 1 era perdonare e se tu
ha fatto un refuso con solo output e
definito nell’angolare 2 è molto di più
robusto se sei così è solo uscita
quantità del titolo e un intervallo di input solo per
estetica quindi ora possiamo aprire la nostra
browser e aggiorna e non lo fa
emettere le persone conta e questo è
perché non l’abbiamo detto all’angolare 2
le nostre componenti dell’app useranno le persone
contare il componente così come faremo ng4
mettilo nelle nostre direttive nella parte superiore
vista e finalmente possiamo rinfrescare e vedere
che in realtà funziona, ma c’è
nessun legame ancora al forum così dopo
cosa che sta andando ad avere a che fare è
integrare con l’ intervallo di input e quindi
le forme angolari 2 sono molto più robuste
perché devi definirli nel tuo
auto componente B prima di poterle usare
nel tuo modello ben angoloso tu
usato solo un modello e lo lega semplicemente
a tutto ciò che vuoi in 2 angolari
in realtà bisogno di definire il modulo
elementi e ciò che noi chiamiamo sono
controlla e
quindi devi istituirli nella tua
componente e non possono vivere un solitario
in realtà ha bisogno di essere in un gruppo di controllo
puoi pensare solo a un gruppo di controllo
come un forum è solo che è stato costruito
con annidamento in mente in modo da poter nidificare
i gruppi di controllo hanno convalida per tutti
di loro e per costruire il nostro controllo
gruppo avremo bisogno di un generatore di moduli
che useranno semplicemente l’ iniezione di dipendenza
averlo e creerà un gruppo a
gruppo di controllo con un controllo chiamato Carl
importo e quindi dobbiamo dire angolare
che vogliamo anche noi per creare un’istanza
questo generatore di forme nel contesto di questo
componente e possiamo andare al nostro HTML e
leghiamo le nostre forme al gruppo di controllo
abbiamo creato così come l’oggetto di controllo
per l’input finalmente diciamo angolare
che useremo questi nuovi
direttive queste nuove direttive nel nostro
componente del campo di persone in modo da formare le direttive
solo una raccolta di tutte le direttive
relativo ai moduli così abbiamo appena importato e
dille che lo useremo oh
anche da ora ti rendi conto che il nostro
importo della proprietà non è collegato al nostro
controllo della quantità in alcun modo in cui effettivamente
bisogno di ascoltare dire angolare per dirci
quando cambia la proprietà della quantità
il mondo esterno in modo che possiamo aggiornare
il nostro controllo e lo useremo lo faremo
che usando il ciclo di vita invariato così
c’è un’unità sul cambiamento distrutta
nel nostro caso useremo semplicemente invariato
e ogni volta che cambia la priorità
stiamo aggiornando di nuovo il nostro controllo
per quando il mondo esterno lo cambia
allora possiamo andare in un browser e aggiornare
e vedere che il legame in realtà
succede cambiando l’input cambia
il valore del controllo di quantità che è
ottimo quindi se hai visto qualcuno dei nostri
parla di agata, lo troverai
stiamo parlando abbiamo un 2 angolare c’è
associazione dati unidirezionale, quindi cosa significa
è quello in esso mentre in angolare 1 se tu
aveva un componente che è una direttiva e
hai avuto per esempio un isolato
portata avresti di solito un dato bidirezionale
vincolante con il segno di uguale in questo in
la proprietà della scuola e questo significherebbe
che ogni volta che lo cambiava da
l’esterno si propagherà attraverso
la direttiva ma ogni volta che cambia
la direttiva si propagherà anche a
l’esterno e questo è ciò che fa
app enormi è molto difficile
una ragione su chi sta facendo il cambiamento
e quando così nell’angolare 2 abbiamo optato di più
per il collegamento dati unidirezionale in modo tale da
il genitore potrebbe dire che il bambino potrebbe legare
qualcosa come un bambino ma non il
in un altro modo se qualcosa ha bisogno
per propagare dal basso verso l’alto ha bisogno di
accadere tramite un evento così da dimostrare
questo dimostra bene cosa intendo
solo andando a produrre il quartiere
importo e ti mostrano che nel browser
se ci aggiorniamo vedrai che essa
non aggiorna la vista del modello no
aggiorna solo il valore di in
componente che si aggiorna quindi non lo è
propagando così di nuovo per farlo
propagare avremo un evento
che chiamerà evento cambiamento importo TT
e notare che stiamo usando le parentesi
per l’attributo qui per dire che questo
è un evento e per ora tutto ciò che farà
è aggiornare il modello direttamente a
implementare questo evento sarà effettivamente necessario
per dire angolare che abbiamo questo evento
di nuovo è molto più dichiarativo e
questo evento è solo un emettitore di eventi
introdurremo dall’angolare 2
modulo e istanziarlo quindi nel nostro
in realtà un incendio un evento su questo evento
emettitore diremo che su click off
questo pulsante chiamerà un metodo
rapporto quantità che implementerà giusto
ora noti ancora che stiamo usando
parentesi per clic quindi questo dirà
angolare per fare solo il listener dell’Avvento
sull’elemento pulsante, quindi possiamo
implementare il nostro metodo e il nostro metodo lo farà
fare è creare un oggetto evento e sparare
l’evento emittente ha l’emettitore di eventi
interfaccia simile agli iteratori così punto
successivamente con un oggetto evento e il
l’espressione nell’HTML verrà richiamata
quindi ora possiamo aggiornare il nostro browser
e vedi che è Ashley che si sta propagando così
si sta propagando al nostro modello dal nostro
componente che è davvero fantastico, ancora una volta
sempre se guardi questo
annotazioni puoi vedere che sono a
molto più esplicito ci sono molto di più
dichiarativo in modo che sia qualcosa di nuovo
e angolare 2 bene un angolare 1 hai
guardare un codice di codice di direttive a
renditi conto di cosa sta facendo qui che possiamo usare
questo per generare API Docs questo è
aiutare gli IDE ti aiuta anche tu
permette angolare di ottimizzare il tuo codice e
se un altro umano legge questo, può farlo
può capire direttamente che questo componente
ha queste proprietà questi eventi e così
su così prossima cosa nella nostra applicazione per la sua
arrivare dove era la nostra demo era
implementare la cosa che prenderà
cura del nostro socket e lo chiameremo a
gestore di socket perché siamo fantastici con
nomi e quindi di nuovo questo è solo un
servizio che è una classe che siamo
esportando e ha una proprietà chiamata
socket che rispetterà un’interfaccia
questo è definito nella nostra digitazione nel nostro
file di definizione quindi questo socket
basta essere un socket I / O che sia
collegato alla porta 98 98 che ho
in esecuzione in background e questo
il servizio avrà due metodi il primo
uno è il quartiere di aggiornamento che lo farà
in realtà prendere un cambiamento dal
applicazione e propagarlo in altro a
altre due app ad altre persone in esecuzione
l’app e per farlo useremo a
struttura dei dati in cui il nome del
il quartiere è la chiave e il valore è
l’importo in modo da notare l’avviso che
qui sto usando il dinamico calcolato
nomi di proprietà in oggetti letterali se
non sei sicuro di quello che sarà quando lo farai
passa ad agire nel master 5 vedrai il
equivalente e avrà anche un metodo
in modo che quando altre persone lo aggiornano
per la nostra applicazione avrà un ascoltatore di quel
un altro servizio fornirà e quello
l’ascoltatore sarà chiamato con a
nome del quartiere e l’importo in modo che il
la struttura dei dati è simile a quella
sopra, quindi andremo a scorrere il
chiavi che sono il nome del
quartieri e chiama l’ascoltatore sì
quindi nel nostro gestore di quartiere noi
può iniettare il gestore di socket in modo che noi
per esempio puoi ascoltare quando c’è
modifiche per aggiornare il quartiere
modelli così appena iniettati e di solito questo
è sufficiente perché l’iniezione avvenga
ma con il tipo corrente dovrebbe
convergere abbastanza la versione corrente di
il compilatore dattiloscritto che sto usando
abbiamo anche aggiungere la piccola annotazione
quindi questo non sarà necessario nel prossimo
versione di dattiloscritto alla prossima versione
quindi annoteremo questo parametro su
Diciamo che vogliamo iniettare il socket
e ER e questo è solo tra i servizi
non da
a due componenti quindi possiamo usare la nostra presa
gestore e ascoltare quando c’è un
cambia quello che succede e quando c’è un
cambiare quello che è successo vogliamo filtrare
attraverso la raccolta di quartieri
che abbiamo filtrato via
nominare così usando il metodo di filtro su un
array ora qui vedo che il tipo è
dicendomi che c’è un errore con
quartiere e quando lo esaminiamo
puoi vedere che c’è una mancata corrispondenza di tipo
quel filtro restituisce un array mentre siamo
mi aspetto un oggetto di quartiere così questo
è un posto in cui è utile il controllo dei tipi
quindi prendi il primo risultato del
array di filtri assicurati che esista
e aggiorna il modello in modo da tornare indietro
alla propagazione dei dati se ricordi in
il nostro evento sul nostro conto conta persone
stavamo aggiornando direttamente il
quartiere come con una funzione setter
ma non è bello perché ora se tu
voglio dire al nostro gestore di socket di puntellare
per inviare quei dati ad altre persone
aprendo l’app il quartiere il
il modello di quartiere deve dirlo a
la presa e questo non è un buon design così
invece quello che faremo è fare
che questo evento dice al componente dell’app
sul cambiamento che dirà il
gestore del quartiere riguardo al cambiamento
e quindi aggiornerà il modello e
il gestore di socket così di nuovo è tutto
sulla propagazione dei dati e sui proprietari
i dati quindi qui aggiorneremo solo il
espressione evento per chiamare un aggiornamento
funzione di quartiere e tutto ciò
la funzione farà sul nostro componente è
chiama il gestore del quartiere e no
combattere per il cambiamento, quindi abbiamo bisogno di a
riferimento alla nostra mano di quartiere
gestore di quartiere che chiamerà
il quartiere di aggiornamento su una funzione su
che implementeremo solo
in questo momento, quindi, quello che farò è il primo
Dillo al socket sul cambiamento in modo che
quindi potrebbe inviare un evento che racconta
altre prese su di esso e poi lo farà
aggiorna anche il modello così ora se apriamo
il nostro nel nostro browser non l’abbiamo detto
angolare sul servizio di gestione socket
quindi lo faremo da
oppure entri nella nostra app componente e
beh, possiamo inserirlo nell’iniettore dell’app
proprio come ender di quartiere ma
concettualmente il gestore di socket non lo è
a livello di componente è sul
livello di bootstrap perché ne vogliamo uno solo
gestore di socket per pagina, quindi faremo appena
mettilo come secondario per il bootstrap
funzione e poi di nuovo possiamo aggiornare
e apri un’altra finestra aprendo la stessa
app e puoi vedere che i dati ottengono
propagato tra i due così siamo arrivati
la nostra demo iniziale che abbiamo mostrato nel
presentazione e anche se si vuole
essere in tempo reale, dobbiamo solo ascoltare
l’evento di input sull’input che è in
html5 e puoi vedere che si propaga
in tempo reale all’altro browser quindi sì
è abbastanza carino ora convertiamolo
questo per padroneggiare 5 quindi quanti di voi
penso che sarà dura solo una volta
è così sarà facile e tu sei
hai ragione, in realtà dovremo farlo
per prima cosa modifica i file di script della scheda su jas
cambia la classe in una funzione e inserisci
i nostri metodi sul prototipo quindi se tu
non ero sicuro di quali fossero i prototipi prima
Penso che ora vedi l’equivalente se
vieni da un mondo dove c’è
classi che dovremo anche fare
rimuovere eventuali informazioni di digitazione e per
il parametro predefinito che stiamo andando
usare l’operatore o che non lo è
Equivalente al 100% ma fa un lavoro
e poi andremo al nostro cambio di socket
da TS UJS cambia la classe in a
funzione e metti i metodi su
prototipo rimuove qualsiasi informazione di battitura
e ora abbiamo anche grasso arif oh abbiamo
abbiamo il calcolo dinamico
nome della proprietà quindi se vi state chiedendo
con quello che era in un concetto sei
questo è l’equivalente collo maestro cinque
e sembra solo meglio in un concetto
sei così e poi c’è l’errore di grasso
funzione che li convertirà a lungo
la forma funziona così molto più caratteri
quindi abbiamo già convertito due dei nostri file
convertiamo il nostro gestore di quartiere
quindi non ci sono importazioni nell’episodio 5 tu
devo solo includere questo file
te stesso o utilizzare qualcosa come yjs così
cambia la funzione in una classe rimuovi
qualsiasi informazione di battitura allora qui abbiamo
questa annotazione che viene iniettata così se
ti stai chiedendo qual è l’equivalente
in ECMO strip 5, un parametro è a
proprietà chiamata parametri sul
funzione che conterrà il parametro
le informazioni di iniezione quindi possiamo
aggiungi i metodi al nostro prototipo qui
continua a cambiare le nostre funzioni di errore in
effettive funzioni di lunga durata e qui noi
stiamo usando questo quartiere ma
nell’atmosfera 5 perdi questo quando tu
crea una nuova funzione ma in errore
funzioni che non è il caso in cui il
il solito trucchetto è fare una barra che sia uguale a questo
angolare sì quindi continueremo
cambiare la funzione a lungo termine in un normale
funzione e aggiungere una dichiarazione di ritorno
perché non ne hai bisogno nel nostro
funzioni ma lo fai nel formato lungo
funzioni ma ora non è cosa che non noi
non devi usare var che è uguale a questo
in realtà possiamo solo fare riferimento al
collezione di quartiere e usarlo come
che sembra un po ‘meglio ora se lo sei
chiedendo l’equivalente di diffusione
superiore del parametro Resta Resta
possiamo usare il prototipo di area
affettato call hack per ottenere tutto il
argomenti come una matrice quindi anche noi possiamo
cambia la funzione di errore e avere
spread operator che stiamo usando su push
possiamo usare quello si applicano invece così ancora
questo è molto sintattico
zucchero che esiste in eccesso di sei e
rimuovere le informazioni di digitazione e il gioco è fatto
con il nostro vicino Hadler c’è
ancora i due componenti hanno lasciato il primo
le persone contano, quindi rimuoviamolo
cambiarlo da tjs e rimuoverlo e cambiarlo
la classe a una funzione rimuove il
digitando le informazioni aggiungi i metodi a
il prototipo
rimuovere le importazioni e ora il
le annotazioni sono una proprietà chiamata
annotazioni sulla funzione e loro
diventare sotto lo spazio dei nomi angolare o
l’oggetto angolare e abbiamo
annotazione aggiunta a loro e noi
da tutto ciò che stavamo importando
il modulo angolare 2 è ora sotto il
oggetto angolare e per dipendenza
iniezione per il nostro costruttore di nuovo
useremo i parametri che diranno
angolare cosa iniettare sul
costruttore e credo che abbiamo finito
qui sì quindi possiamo andare alla nostra app
rimuove i componenti da tjs remove
le importazioni cambiano la classe in una funzione
cambia questo in prototipo e poi noi
avere le annotazioni è come prima
cambiarlo nella proprietà annotation e
aggiungi le informazioni per la dipendenza
iniezione e abbiamo finito la conversione di RL
sono tutti i nostri script di tipo per echo il passaggio 5
abbiamo solo 0 tranne il bootstrap
file per la funzione bootstrap in un file
angolare in ES5 in realtà abbiamo bisogno di
ascoltare quando il cane viene caricato
questo non è il caso di ES6 perché lo siamo
caricandolo tramite il sistema js che lo farà
prenditi cura di quello ma non è il
caso in es5 quindi vai al nostro cambio di indice
la versione angolare a SFX così
mette tutto sulla portata globale
invece di cose da importare dal
modulo dobbiamo anche aggiornare il nostro script
tag perché non stiamo usando alcun fallo
odore e rimuovere il sistema che importa così
ora possiamo aprire a maglia nel nostro browser e
vedere che sta funzionando proprio così ora
facciamo qualcosa di ancora più folle e
convertiamo questo in 1 angolare, quindi per prima cosa
per prima cosa cambieremo la nostra
versione angolare a 1,4 così 1,41 appena ottenuto
rilasciato due giorni fa ma non l’ho fatto
riregistrare tutto in un giorno anche noi
bisogno di cambiare dalla nostra app
definirà il nostro modulo che abbiamo appena inserito
in cima quindi lo definirà con
modulo angolare che non esiste in
angolare 2 ma avrà uno negativo
il nostro sistema modulare così i nostri componenti
è solo una direttiva con il suo nome
il selettore ma il cammello è incastrato e anche questo
ha una limitazione ad essere usato solo come
elementi ha anche un URL modello
che è uguale all’annotazione della vista
quindi abbiamo anche una funzione di collegamento
collegherà nel nostro caso il quartiere
gestire una collezione per esempio al
portata così che sono tutte le informazioni che
possiamo capire che siamo nel nostro
annotazioni di nuovo in modo angolare 1 come
direttive e servizi sono globali
registro che è nel caso in rabbia
troppo cose come l’app injector e
le direttive sono un non possiamo dirlo
non c’è equivalente in nessun altro
quindi c’è questa funzione che ha usato
essere sul nostro componente che stiamo andando
mettere il nostro scopo per comodità e
sì, ci siamo liberati di quei due
c’è ancora il quartiere di spinta
che potremmo mettere sulla nostra direttiva ma
Sento che dovrebbe essere in un blocco di corsa
potrebbe non essere d’accordo, possiamo discuterne
di persona avrai appena ricevuto il servizio
e infine in questo file c’è un
bootstrap che in angolare 1 è
diverso quindi lo diamo effettivamente
nome del modulo sì, questo è tutto per questo file
stiamo andando nel nostro quartiere
gestore che è più facile da convertire in
angolare 1 avremo il nostro modulo ed è
un servizio ovviamente con il
il gestore di quartiere funziona solo
altra differenza qui è che siamo
usando il modello di quartiere che noi
Non voglio che sia globale, quindi lo faremo
iniettarlo nel nostro servizio lo faccia riferimento
proprio lì mettiamo questo in un
invocando immediatamente l’espressione della funzione
quindi non inquiniamo l’ambito globale in
in touch trip non è il caso
perché ogni cosa che definisci in a
modulo non andare all’ambito globale così
abbiamo finito con il gestore del quartiere
il santander è in realtà ancora più semplice
anche un servizio con cui ci registriamo
angolare 1 e abbiamo finito qui possiamo andare
al nostro modello solo indentazione no al nostro
Questo modello potrebbe essere una fabbrica che
restituisce il modello in modo molto semplice
avvolgetelo in un wifey che abbiamo
lo pronunciato comunque e bene questo
non deve essere la fabbrica che possiamo
in realtà lo cambia in un valore che non lo è
comune ma funziona ancora e finalmente siamo
fatto con la nostra cartella di servizio abbiamo solo
conta il nostro popolo, quindi è di nuovo un
modulo angolare che è direttiva che è
in questo caso le persone vengono chiamate così
limitato limitato a un elemento e
ha lo stesso URL modello di una vista
annotazione e facciamolo avere
un ambito seghettato perché è molto
facile da fare in modo da notare che qui in
angolare 1 non abbiamo la scelta ma
utilizzare l’associazione dati bidirezionale a meno che noi
voglio metterlo da parte in modo che
significherebbe che se in quantità simile
cambiamenti nella direttiva lo farà
propagare al genitore ma non lo facciamo
voglio quello perché poi è come l’app
è più difficile sapere cosa sia
cambiando chi sta cambiando cosa siamo
resterò fedele al nostro evento e useremo questo
migliori pratiche quindi avremo il nostro link
funzione e in realtà abbiamo finito
tutte le informazioni che sono nel
annotazioni tranne per il ciclo di vita
che non c’è non ha equivalenti in
angolare 1 quindi dobbiamo calcolare mentalmente
che l’equivalente è in realtà da guardare
la quantità di proprietà e aggiornare il
controllo quindi diamo questo in mente e
rimuovere i nostri orientamenti per ora così dentro
angolare 1 non c’è equivalente a
controlla il tuo è tutto gratis per tutti
quindi per abbastanza per il nostro caso lo faremo
mettilo come un primitivo e di nuovo la vita
il ciclo guarderà invece quale no
esiste nell’angolare 2 e guarderemo il
ammontare la proprietà e aggiornare il nostro controllo
perché altrimenti se ci affidassimo
la nostra quantità di proprietà che avremmo aggiornato
i loro dati genitore che non è qualcosa
vogliamo così finalmente metteremo il nostro telecomando
rapporto sull’importo
montare il metodo ooh scusa si abbiamo messo il nostro
reporter metodo Matt e l’evento
la sintassi è leggermente diversa, non è un
iteratore è solo una funzione che tu
chiama e abbiamo finito con questo così abbiamo solo
convertito il nostro JavaScript da
angolare 2 ad angolare 1 l’unica cosa
quello che rimane è il nostro HTML così in angolare 1
non c’è energia per il modello invece di
controllo energetico il suo modello energetico e anche
non c’è un evento di clic generico che hai
in realtà bisogno di utilizzare un wrapper in
questo caso ng-click e nella nostra app
modello non c’è energia per il suo
ng-ripeti con un po ‘diverso
indice e anche non ci sono parentesi a
dì che c’è un legame, quindi dobbiamo
rimuovilo come puoi vedere
in realtà perdere informazioni con angolare
1 perché ora guardando questo non lo è
ovvio che cosa è un legame che cosa è un evento
devi effettivamente andare alla direttiva
codice per capirlo finalmente qui sì
è così che possiamo andare al nostro browser e
aggiornare e vedere che funziona
tranne che c’è un problema con il
sincronizzazione tra l’importo del componente e
l’importo del modello e questo perché
quando lo stiamo cambiando stiamo ricevendo un
evento dal socket e in angolare 1
dobbiamo dire all’angolare di fare come lo scopo
che si applicano per dirgli di fare lo sporco
controllando che non esista nell’angolare 2
perché abbiamo usato onda GS in modo che ciò accada
automaticamente per te ma per angolare 1
il nostro gestore di socket deve dire angolare
per tornare indietro e il contesto angolare se
così ti inietteremo uno scope di root
perché è un servizio e lo scopo
applica il famoso ambito che si applica e così
ora dovrebbe funzionare così abbiamo appena avuto
la nostra app in angular 2 e dattiloscritto allora
lo convertiamo in un cluster 5 poi noi
convertirlo in angolare 1 e immagino che tu
usa tutta la differenza, quindi abbiamo finito
codifica finalmente, quindi quello che abbiamo imparato è stato
tutto questo bene prima che poi angolare
2 usiamo echamos tip 6 moduli noi
avere il nostro sistema di moduli modello così
ci integriamo molto bene con il
lingua e infine la lingua dà
fa questa roba invece di dover
fare affidamento su requirejs o navigare se lo faccio
di nuovo stiamo usando ECMO step 6 e
dattiloscritto e se siete preoccupati
le aggiunte di pedigree come i tipi
e annotazioni ci sono le proposte
per Ahmed nave 7 per avere queste caratteristiche
quindi è decisamente tutto e anche
un angolare 2 abbiamo questa idea di
componenti che consentono molto di più
isolamento in modo da poterlo simulare
in 1 angolare come abbiamo fatto ma è possibile
anche non simularlo e poi tu sei
difficile mantenere lungo la strada e quindi anche
è molto più dichiarativo così dentro
angolare 1 non ci sono informazioni nel
modello per esempio sui binding
e gli eventi in angolare 2 c’è e
finalmente se ho un consiglio se sei così per ora
se vuoi implementare qualcosa tu
dovrebbe implementare in angolare 1 se sei
costruire un’app di produzione ma se tu
voglio costruirlo in un modo che sarà così
può anche essere facilmente convertito in angolare 2 I
suggerisco di guardare nel controller come
sintassi che consente di prendere
il tuo controller ed esporlo al tuo
portata così in realtà così in angolare 2 noi
non ha menzionato lo scopo di tutto ciò che era
solo dietro le quinte in 1 angolare
fare a meno che non si usi il controller come
anche la sintassi impedisce cose come te
ottieni la notazione a punti che è la migliore
pratica in angolare 1 usando solo a
troller culo così prima di separarsi prima
lasciandomi voglio solo dartene un po ‘
risorse per angular 2 se vuoi
esplora un po ‘di più, ce n’è una bella
buoni post sul blog di Victor che
anche lui fa parte della squadra angolare
ionico ha una piccola introduzione in serie
al pensiero angolare 2 quale percorso
Anche Pascal è una delle persone dietro
ha informazioni ho un post sul blog su di esso
inoltre ho trovato questo blog di questo post da
punte angolari sul motivo per cui 2 rocce angolari e
anche se va anche in molto di più
dettagli e finalmente sento che dovrei
menzionare il repository angolare / angolare
che è dove angolare 2 è essere
sviluppato così
Sento che non è collegato a dire alla gente
semplicemente andare a una storia professionale e leggere il
prova e leggi il codice base si
come impari molto sul framework
anche se hai problemi puoi aprire
è lì e finalmente se vuoi vedere
l’app che si desidera scaricare per l’esecuzione
e così via e vedere così ho il
diverse versioni in diversi rami
quindi è sotto il mio github personale o a
i nomi utente hanno già quello / turisti
in un viaggio e sì se vuoi evitare
questo documento ci è stato detto che puoi farlo su a
app mobile e abbiamo finito così provo ad andare
attraverso questo veloce per avere tempo per
domande ne hanno qualcuno
domande sull’angolare 2 anche
angolare 1 tutto ciò che dovrei sì bene io
non so se hai bisogno di un microfono
la presentazione è sì
ciao quindi devi renderti conto dell’angolare
il tuo servizio in qualche modo così puoi farlo
fallo nell’iniettore dell’app o nel
funzione di bootstrap ma poi di iniettarla
nella tua funzione o nel tuo costruttore sì
devi usare annotazioni con il
parametri ma non sono sorpreso se
le persone svolgono le funzioni di supporto del metodo di supporto
come le librerie che ti aiutano a farlo
anche il prossimo discorso riguarda la dipendenza
Iniezione quindi forse ne hanno di più
informazioni su di esso ma onestamente come te
stavi facendo qualcosa di simile
con l’angolare 1 così eri se lo sei
anche solo lasciandolo analizzare
funzione o fai metterlo in un’area
quindi non è poi così diverso così tanto
angolare 2 la cosa è che funziona molto
di più sui tipi finché ne hai uno
gestire ad esempio un numero di persone
componente sì si può avere in un altro
file definito che le persone contano ha bisogno
questa roba da iniettare in essa
anche se direi che è più difficile
mantenere lungo la strada perché intendo
ogni volta che vuoi cambiare il
dipendenze si devono anche andare un altro
file invece di avere il suo beacon
consolidato in un unico file
alla fine della giornata è JavaScript è
molto flessibile in modo da poter fare cose folli
con l’orientamento angolare siamo tutti
la vita da studente questi non sono consapevoli lo farei
dicono così ciò che è grande è stato angolare 2 è vero
si integra molto bene con la lingua
così solo quando ti inietti qualcosa
gli dai semplicemente una funzione casuale e
in questo di default istanziato
la funzione è nuova ma puoi avere
la tua ricetta in modo da poter dire questo
la funzione jquery in realtà non è altro
che il valore così proprio come un aguilar
uno abbiamo avuto quel valore con il nuovo
sistema di iniezione di dipendenza che hai
cose come legare jquery a jquery e
che lo legherà come valore e io
pensa che nel prossimo stock vedrai
più su questo altre domande si
alcune annotazioni sono ammissibili a parte
dai componenti di qualsiasi altro
lingua per favore c’è anche una direttiva
annotazione così mentre i componenti sono a
componente in un’applicazione una direttiva
è qualcosa che cambia un esistente
elemento come ng4 è anche una direttiva
chiunque potrebbe crearne uno proprio
annotazione è in realtà solo una funzione
questo è messo su un’altra funzione
Non sono sicuro di altre annotazioni
che stiamo usando oltre che iniettare
vista componente sì, è carino
molto credo a qualsiasi altra domanda
sì
la fabbrica
destra
personalmente non lo so, quindi sono un
appaltatore che lavora a distanza per la squadra
quindi in quel momento ero davvero un tempo
differenza di zona è la riunione della squadra
come a mezzanotte quindi non partecipo
in tutti, ma così è dentro
Anteprima dello sviluppatore per un motivo e io sono
non sono sicuro se dentro qualcuno di Google
già iniziando ad usarlo anche se io
non sarei sorpreso se loro lo sapessero
in angolare e la squadra che abbiamo chiesto di avere
abbiamo fatto un hackathon in cui abbiamo solo
costruisci app con angular 2 e metti
sono tutti problemi che non ci piacciono
il framework che vogliamo sistemarti
puoi puoi ben angolare le università
capita di entrare in un paio di giorni a San
Francisco probabilmente ti farai del male qui
altre notizie e vado da loro quindi basta tenere
un occhio su Twitter o qualsiasi altra cosa
carnevale quindi una persona
e
si, probabilmente è lei, è lei
lavorando su di esso quindi sì abituato a lavorare su
sì, c’è materiale angolare che non conosco
sapere se altre librerie di componenti
che sono sviluppati dalla squadra ma io
non sarebbe sorpreso era angolare 2 a
avere un intero ecosistema su di esso perché
è molto più isolato c’è un
molti più standard migliori se si così bene
sì per l’angolare 1 non penso ci sia
qualsiasi eccetto che google tranne che angolare
materiale ma questo è tutto grazie
tu
sono un membro del team di base angolare
e in realtà volevo iniziare il
presentazione con qualcosa un po ‘
prova speciale a svegliarti un po ‘così
voluto mostrare bene in realtà quando ho
quando Carmen mi ha invitato a questo discorso lei
mi ha detto di non esitare a fare cose folli
quindi una cosa che voglio mostrarti è una
dei miei hobby che sono un mago
quindi non sono un professionista ma è ancora
piuttosto divertente soprattutto da noi
dire che l’angolare è un supereroe è
è pertinente, quindi ho rotto questo
scusa, quindi ne proverò un’altra
aspetta, ho un mazzo di carte con me
quindi signore, ti dispiacerebbe dirmi basta
ogni volta che ti va bene così andiamo
guarda la carta così la tua carta è la 9
di picche questo è interessante perché se
guardi il sito web angolare di Taio e
guarda il doctype lo troverai
la tua carta è proprio lì
in modo che mi porti al mio argomento che è
angolare 2 quindi se non hai sentito
su angular 2 è la prossima versione di
angolare e il suo sito web è taio angolare
quindi cambiamo da angularjs a angularjs
punto org a taio angolare quindi è qui
troverai altre risorse per i ricercatori
per l’angolare 2 tutto bene così attualmente
angular 2 è in Developer Preview quindi io
vuoi vederne l’anteprima
sviluppatori e per questo ho una demo così
è un’applicazione in cui è scritto
angolare 2 quindi cosa fa l’applicazione
abbiamo solo i quartieri in
Amsterdam e puoi segnalare l’importo
di turisti in un viaggio che vedi in a
dato quartiere e si propaga a
l’altro browser quindi se vi state chiedendo
cosa intendo per turisti in viaggio
non deve necessariamente essere un buono
viaggio potrebbe essere un brutto viaggio da quando siamo
ad Amsterdam, questo è questo
l’applicazione ha un paio di componenti
di cose interessanti in esso piace dove siamo noi
abbiamo la gestione della collezione che abbiamo
componenti in esso abbiamo integrazione
con le prese del forum quindi per questo
presentazione Io dico costruiamolo facciamo
costruiscilo insieme in modo che non sia vivo
codificandolo verrà registrato il codice in tempo reale
quindi spero di non poter incasinare così è
perché è registrato così sarà prima
iniziare costruendolo in angolare 2 e
dattiloscritto che è il linguaggio che
Angular 2 è scritto in e parleremo
a questo un po ‘di più e poi a
scopi di apprendimento che stiamo per convertire
a acma strip 5 quindi ancora angolare 2
ma il senape al collo 5 così puoi vedere
la differenza e poi andremo un po ‘
più pazzo e convertirlo in angolare 1
durante questo discorso quindi se lo sei
chiedendosi che dattiloscritto è solo un
superset di es6 che è il prossimo
versione di JavaScript e ha appena
tipi e annotazioni aggiunte
onestamente potremmo fare un intero discorso su es6
è molto eccitante ma questo è il
traccia di angularjs e se lo facessimo quando
voi gente iniziereste a ballare
eccitazione che è grande, tranne che sarò
incluso, quindi non va bene per il discorso
e anche se pensi che echamos se
sei è qualcosa nel futuro che è
non qui ancora bene i miei amici siamo noi
arrivare a quel futuro se guardi
il supporto del browser Firefox ha già
sessantasei per cento delle caratteristiche dell’Essex
cromo 45 per cento e la versione bordo
di IE che arriverà anche in Windows 10
ha il 63% rispetto ad alcuni
le bandiere vanno bene quindi iniziamo con
costruendo la nostra appt la stessa app che
Ho appena dimostrato che prima abbiamo bisogno del codice
base di angolare 2 e per scoprire che noi
puoi andare su codice angularjs org lo farai
trova tutte le build di angular 2 così e
vorremmo i due punti zero punto zero
alpha quindi se si fa clic su che vedrete
quello sarà finito e una cartella che ha
tutte le build useranno il dev
questo ci darà migliori messaggi di errore
e questo sarebbe scritto in Natale
viaggio di sei moduli e quando andremo a
convertirlo in un concerto a cinque stiamo andando
usare la versione sfx che mette le cose
nella portata globale va bene così andiamo
inizia a scrivere per prima cosa, quindi avremo
il nostro tag script che include angular 2
e dal momento che ho detto che siamo in un fumetto
sei moduli che dovremo fare
include i sistemi a / s che è una libreria
così carica tutti i tipi di moduli
JSA e D comuni e così via compresi
sei uguali quindi useremo questo e
dal momento che questa è una demo vera e io no
voglio nascondere le parti brutte che abbiamo anche noi
una dipendenza dal tracciante sulla traccia per
runtime perché parte dell’angolare 2
la base di codice è ancora compilata con randagi
signore, non è tutto convertito in questo
script ancora così ma sarà rimosso
nel prossimo futuro e giusto e da allora
vogliamo che vogliamo che questo appaia bene
in realtà include anche il bootstrap con a
tema per farlo sembrare Google
design dei materiali quindi dopo anche noi
ho bisogno di socket I / O perché useremo
prese e calzino che ero un po ‘il
la migliore soluzione e ora quando si tratta di
dattiloscritto abbiamo anche bisogno di includere il
file di definizione delle nostre librerie di venditori
quindi dal momento che stiamo includendo solo il jas
costruito quale è il
risultato della compilation che dattiloscritto
e vogliamo che il typescript faccia tipo
il controllo includerà la definizione
file che indica solo i tipi di
compilatore che questa classe ha questi
proprietà e così via così che cosa questo
fare è una cartella chiamata digitazione bene
troverai tutti i Taiping e un file
che fa riferimento a tutti loro così nel nostro
l’app farà solo riferimento a questo file e
quindi il compilatore sa come fare è
tipo di controllo e così via ultima cosa per
dattiloscritto è anche necessario dargliene alcuni
parametri sì, ne abbiamo alcuni per alcuni
configurazione per il nostro compilatore di messaggi
semplicemente vendendolo per compilare 2s 5s per
esempio invece di es6 e possiamo iniziare
sviluppando la nostra prima componente angolare
quindi un componente è solo una classe e io
Non può fare un passo 6 classe sarà chiamando
l’app tour stripping farà riferimento
quel file di definizione che abbiamo menzionato
quindi dopo possiamo importare le cose da
il componente angolare 2 come componente e
l’annotazione della vista e anche un bootstrap
funzione per avviare la nostra app che siamo
dovremo annotare la nostra classe a
dire angolare che questo è un componente
e gli daremo un selettore quindi un CSS
selettore che quando angolare troverà un
elemento che corrisponde al selezionatore
istanziare questo componente e anche
diciamo che diciamo che questo componente
ha una vista con un URL modello in modo che
il modello sarà iniettato nel Dom
ogni volta che angolare lo troverà
componente nell’HTML così così ora nel nostro
indice di HTML possiamo fare riferimento al nostro nostro
componente e importa il nostro modulo perché
siamo in striscia ECMO sei useranno
sistemi sì e finalmente prima che possiamo
in realtà aprirlo nel nostro browser reale
avviare il componente utilizzando il
funzione di bootstrap dandogli solo il
funzione componente ben classe esegui il nostro
compilatore dattiloscritto utilizzando molta modalità così
continua a compilare esegui il nostro server HTTP
e quindi possiamo aprire il nostro browser e vedere
funziona così ce l’abbiamo sulla porta 8080
quindi abbiamo ottenuto l’angolatura base da impostare
con il compilatore dattiloscritto così ora siamo noi
può iniziare a sviluppare la nostra app in modo giusto
l’ultima cosa saranno i tipi di compilatore
uscita in file JS ma ovviamente lo saremo
funziona con il file di foglio che vedi
è proprio accanto al lato del teatro per
il file di script di tipo nel file
la configurazione si può cambiare a
un’altra directory ma per questo sarà solo
mantienila semplice così ora inizia
pensare alla nostra app ci piace davvero
ingegnerizzare la nostra app abbiamo questo modello
chiamato quartiere e questo modello
avrà un nome e il turista trippino
ammontare come la quantità di turisti che
stanno inciampando in quel quartiere e a
gestire quel modello avrà un servizio
chiamerà il gestore del quartiere
perché siamo fantastici con i nomi e così via
questi sono solo sei classi di fumetti
quindi ho una cartella di servizio con a
cartella del gestore di quartiere e il mio
modello di quartiere nascosto quindi è di nuovo
è solo una classe che stiamo esportando
che ha due proprietà che sono le
titolo e l’importo e anche noi semplicemente
avere un costruttore che prende questi due
parametri e metterli sulla classe così
notare che tutto qui è collegato a
digitando è dattiloscritto specifico ma il
classificare il costruttore come predefinito
parametro tutti i nostri natale onorano tutti gli ECMO
spoglia sei, quindi è abbastanza carino anche noi
avere un metodo impostato come quantità TT come il
aiutante che parsefloat il valore nel caso
è stato dato come una stringa, quindi siamo noi
sappiamo che lavoriamo sempre con i numeri
e pensando a questo proprio ora noi
potrebbe avere avuto una proprietà satyr invece
di un metodo immagino di essere un peer reviewing
io stesso qui ma per ora quello
lo farà e quindi per il nostro servizio è
anche solo una classe che importerà il
modello di quartiere con ECMO sip six
moduli e dal momento che il nostro servizio è
fondamentalmente gestendo una collezione di
quartieri avrà a
array di quartiere su di esso così il
la collezione è solo ariosa e ora in
i nostri componenti possiamo importare i nostri
gestore di quartiere e iniziare a usarlo
quindi dobbiamo dire angolare per fare
angular 2 consapevole del servizio così per
che usiamo l’app injector che così
che l’effettiva iniezione di dipendenza
potrebbe accadere nel nostro costruttore così ora
il servizio verrà creato nel
contesto di questo componente e vogliamo
il nostro componente per avere un riferimento a
questa collezione di quartieri così
lo assegneremo semplicemente dal servizio così
ora possiamo andare al nostro cambio di file HTML
il modello da funziona a un effettivo
bella intestazione e inizia a scorrere il
collezione di quartiere che è nella nostra
componente che utilizza energia per simili a
ng-ripeti solo leggermente diversi
sintassi e vorrà anche produrre il nostro
nome del quartiere e importo solo per
scopi di test per ora e da noi
anche bisogno di renderlo spigoloso consapevole di ciò
useremo questa energia per
direttiva quindi lo noterete in e
in Angular 2 non esiste un registro globale
di cose come servizi e direttive
e le direttive che devi dire angolare
esplicitamente che userete
queste direttive e servizi ed è a
un po ‘ più dichiarativo e aiuta con grande
applicazioni così ora prima che possiamo aprire
questo nel nostro browser noterà che il nostro
la raccolta di quartiere è in realtà
vuoto quindi riempiamolo e per farlo
Ho intenzione di utilizzare un design simile al
Eric che spinge il metodo integrato
JavaScript quindi se guardi la sintassi
push in realtà può prendere più elementi
e verranno tutti aggiunti all’array
alcune persone non lo sanno così tanto se
hai più elementi che non hai
devi chiamare push più volte che puoi
chiamalo una volta con più argomenti così
facciamo qualcosa di simile nella nostra app così via
il nostro servizio avrà un metodo chiamato
spingere il quartiere che prende i nomi
del quartiere e che creerà
l’oggetto del vicinato quindi notalo
qui ogni nome di quartiere è un
argomento diverso per la funzione così
solo per mostrare il consiglio di Aikman 6
caratteristica è quando implementiamo questo nel nostro
servizio possiamo usare i parametri di riposo quindi se
non hai familiarità con il resto
i parametri sono immagini di avere un
funzione che accetta un parametro a B e
quindi arrestare il parametro quel parametro
raccoglierà tutti gli argomenti dati a
la funzione
bruciato nel bruciato definito così nel nostro
caso abbiamo solo un parametro di riposo e
così prenderà tutti gli argomenti e
mettili in un Eric e poi mapperemo
per il nostro oggetto di quartiere che usa
funzioni di freccia grossa che restituiscono il
ultima affermazione che era nella funzione
e inoltre persistono questo dal
contesto esterno quindi per spingerlo al nostro
l’area utilizzerà effettivamente push con
spargere operatore così che la diffusione
l’operatore fa è dato un array
è passato a una funzione che sarà
in realtà espanderlo in modo che diventi
più argomenti per quella funzione così
qui è come se passassimo di più
argomenti per la funzione push e noi siamo
facendo ciò invece di concatenare
perché concatenato in costruzione nuovo
array e non vogliamo che noi solo
voglio modificare il nostro attuale arioso così
è un suggerimento eche piuttosto carino 6
funzioni così ora se andiamo sul nostro browser
e rinfresciamo possiamo vedere che possiamo vedere
i nomi e l’importo almeno posso
vederli, non so se puoi, si
di nuovo guardando questo codice non lo so
se così fosse la prossima versione di java
lo script che conosci digita le classi
questo tipo di script ma costruttore e così via
caratteristiche molto pulite a mio parere così ora
Torniamo a pensare la nostra app
quindi vogliamo riportare la quantità di
persone in ogni quartiere, quindi siamo
andando a creare un componente chiamato
le persone contano in modo che sembrino un po ‘
così e come vogliamo invocarlo
sta usando un elemento chiamato numero di persone
con il titolo e una somma quindi facciamolo
inizia a creare bene il nostro componente
college completo nel nostro modello di app così noi
avere il titolo e l’importo e
saranno equivalenti al
Nome quartiere e l’importo sarà
l’importo TT nel quartiere da allora
vogliamo questo vogliamo che ci sia vincolante
tra questa espressione e la proprietà
sul componente dovrà effettivamente
Mettilo nella notazione delle parentesi così che cosa
significa che questo dice angolare che il
il valore è un’espressione di rabbia che
dovrebbe essere valutato e legato al
componente così altrimenti è solo un
Attributo HTML quindi possiamo avere il nostro
il nostro componente che ha due proprietà
titolo e importo
e può dovremo importare il
componente e la vista per specificarlo
angolare che questo è un componente e
qual è la sua opinione, così sarà la componente
avere un selettore chiamato gente conta se
avrai un modello che è giusto
adiacente al componente giusto
quindi la prossima cosa che devi effettivamente dire
angolare che questo componente ne richiede due
proprietà che sono titolo e importo così
poi angolare farà il legame tra
l’HTML e la proprietà su questa classe
e guardando questo potrebbe esserci
confusione con il titolo forse alcune persone
chi pensa che sia in un attributo HTML nativo
quindi parliamo solo del fornitore
prefisso e lo chiameremo TT quindi qui
stiamo dicendo di impostare angolare che noi
vuoi che il titolo sia chiamato titolo sul
componente ma volevamo il titolo TT nel
HTML quindi ora non c’è confusione
questo va al componente conta persone
quindi possiamo andare nel nostro avvio HTML
riecheggiando queste attraverso le proprietà e io
volevo solo smetterla di fartelo sapere
un 2 angolare se si commettono errori e
espressioni si otterrà effettivamente un errore
farà un errore mentre un
angolare 1 era perdonare e se tu
ha fatto un refuso con solo output e
definito nell’angolare 2 è molto di più
robusto se sei così è solo uscita
quantità del titolo e un intervallo di input solo per
estetica quindi ora possiamo aprire la nostra
browser e aggiorna e non lo fa
emettere le persone conta e questo è
perché non l’abbiamo detto all’angolare 2
le nostre componenti dell’app useranno le persone
contare il componente così come faremo ng4
mettilo nelle nostre direttive nella parte superiore
vista e finalmente possiamo rinfrescare e vedere
che in realtà funziona, ma c’è
nessun legame ancora al forum così dopo
cosa che sta andando ad avere a che fare è
integrare con l’ intervallo di input e quindi
le forme angolari 2 sono molto più robuste
perché devi definirli nel tuo
auto componente B prima di poterle usare
nel tuo modello ben angoloso tu
usato solo un modello e lo lega semplicemente
a tutto ciò che vuoi in 2 angolari
in realtà bisogno di definire il modulo
elementi e ciò che noi chiamiamo sono
controlla e
quindi devi istituirli nella tua
componente e non possono vivere un solitario
in realtà ha bisogno di essere in un gruppo di controllo
puoi pensare solo a un gruppo di controllo
come un forum è solo che è stato costruito
con annidamento in mente in modo da poter nidificare
i gruppi di controllo hanno convalida per tutti
di loro e per costruire il nostro controllo
gruppo avremo bisogno di un generatore di moduli
che useranno semplicemente l’ iniezione di dipendenza
averlo e creerà un gruppo a
gruppo di controllo con un controllo chiamato Carl
importo e quindi dobbiamo dire angolare
che vogliamo anche noi per creare un’istanza
questo generatore di forme nel contesto di questo
componente e possiamo andare al nostro HTML e
leghiamo le nostre forme al gruppo di controllo
abbiamo creato così come l’oggetto di controllo
per l’input finalmente diciamo angolare
che useremo questi nuovi
direttive queste nuove direttive nel nostro
componente del campo di persone in modo da formare le direttive
solo una raccolta di tutte le direttive
relativo ai moduli così abbiamo appena importato e
dille che lo useremo oh
anche da ora ti rendi conto che il nostro
importo della proprietà non è collegato al nostro
controllo della quantità in alcun modo in cui effettivamente
bisogno di ascoltare dire angolare per dirci
quando cambia la proprietà della quantità
il mondo esterno in modo che possiamo aggiornare
il nostro controllo e lo useremo lo faremo
che usando il ciclo di vita invariato così
c’è un’unità sul cambiamento distrutta
nel nostro caso useremo semplicemente invariato
e ogni volta che cambia la priorità
stiamo aggiornando di nuovo il nostro controllo
per quando il mondo esterno lo cambia
allora possiamo andare in un browser e aggiornare
e vedere che il legame in realtà
succede cambiando l’input cambia
il valore del controllo di quantità che è
ottimo quindi se hai visto qualcuno dei nostri
parla di agata, lo troverai
stiamo parlando abbiamo un 2 angolare c’è
associazione dati unidirezionale, quindi cosa significa
è quello in esso mentre in angolare 1 se tu
aveva un componente che è una direttiva e
hai avuto per esempio un isolato
portata avresti di solito un dato bidirezionale
vincolante con il segno di uguale in questo in
la proprietà della scuola e questo significherebbe
che ogni volta che lo cambiava da
l’esterno si propagherà attraverso
la direttiva ma ogni volta che cambia
la direttiva si propagherà anche a
l’esterno e questo è ciò che fa
app enormi è molto difficile
una ragione su chi sta facendo il cambiamento
e quando così nell’angolare 2 abbiamo optato di più
per il collegamento dati unidirezionale in modo tale da
il genitore potrebbe dire che il bambino potrebbe legare
qualcosa come un bambino ma non il
in un altro modo se qualcosa ha bisogno
per propagare dal basso verso l’alto ha bisogno di
accadere tramite un evento così da dimostrare
questo dimostra bene cosa intendo
solo andando a produrre il quartiere
importo e ti mostrano che nel browser
se ci aggiorniamo vedrai che essa
non aggiorna la vista del modello no
aggiorna solo il valore di in
componente che si aggiorna quindi non lo è
propagando così di nuovo per farlo
propagare avremo un evento
che chiamerà evento cambiamento importo TT
e notare che stiamo usando le parentesi
per l’attributo qui per dire che questo
è un evento e per ora tutto ciò che farà
è aggiornare il modello direttamente a
implementare questo evento sarà effettivamente necessario
per dire angolare che abbiamo questo evento
di nuovo è molto più dichiarativo e
questo evento è solo un emettitore di eventi
introdurremo dall’angolare 2
modulo e istanziarlo quindi nel nostro
in realtà un incendio un evento su questo evento
emettitore diremo che su click off
questo pulsante chiamerà un metodo
rapporto quantità che implementerà giusto
ora noti ancora che stiamo usando
parentesi per clic quindi questo dirà
angolare per fare solo il listener dell’Avvento
sull’elemento pulsante, quindi possiamo
implementare il nostro metodo e il nostro metodo lo farà
fare è creare un oggetto evento e sparare
l’evento emittente ha l’emettitore di eventi
interfaccia simile agli iteratori così punto
successivamente con un oggetto evento e il
l’espressione nell’HTML verrà richiamata
quindi ora possiamo aggiornare il nostro browser
e vedi che è Ashley che si sta propagando così
si sta propagando al nostro modello dal nostro
componente che è davvero fantastico, ancora una volta
sempre se guardi questo
annotazioni puoi vedere che sono a
molto più esplicito ci sono molto di più
dichiarativo in modo che sia qualcosa di nuovo
e angolare 2 bene un angolare 1 hai
guardare un codice di codice di direttive a
renditi conto di cosa sta facendo qui che possiamo usare
questo per generare API Docs questo è
aiutare gli IDE ti aiuta anche tu
permette angolare di ottimizzare il tuo codice e
se un altro umano legge questo, può farlo
può capire direttamente che questo componente
ha queste proprietà questi eventi e così
su così prossima cosa nella nostra applicazione per la sua
arrivare dove era la nostra demo era
implementare la cosa che prenderà
cura del nostro socket e lo chiameremo a
gestore di socket perché siamo fantastici con
nomi e quindi di nuovo questo è solo un
servizio che è una classe che siamo
esportando e ha una proprietà chiamata
socket che rispetterà un’interfaccia
questo è definito nella nostra digitazione nel nostro
file di definizione quindi questo socket
basta essere un socket I / O che sia
collegato alla porta 98 98 che ho
in esecuzione in background e questo
il servizio avrà due metodi il primo
uno è il quartiere di aggiornamento che lo farà
in realtà prendere un cambiamento dal
applicazione e propagarlo in altro a
altre due app ad altre persone in esecuzione
l’app e per farlo useremo a
struttura dei dati in cui il nome del
il quartiere è la chiave e il valore è
l’importo in modo da notare l’avviso che
qui sto usando il dinamico calcolato
nomi di proprietà in oggetti letterali se
non sei sicuro di quello che sarà quando lo farai
passa ad agire nel master 5 vedrai il
equivalente e avrà anche un metodo
in modo che quando altre persone lo aggiornano
per la nostra applicazione avrà un ascoltatore di quel
un altro servizio fornirà e quello
l’ascoltatore sarà chiamato con a
nome del quartiere e l’importo in modo che il
la struttura dei dati è simile a quella
sopra, quindi andremo a scorrere il
chiavi che sono il nome del
quartieri e chiama l’ascoltatore sì
quindi nel nostro gestore di quartiere noi
può iniettare il gestore di socket in modo che noi
per esempio puoi ascoltare quando c’è
modifiche per aggiornare il quartiere
modelli così appena iniettati e di solito questo
è sufficiente perché l’iniezione avvenga
ma con il tipo corrente dovrebbe
convergere abbastanza la versione corrente di
il compilatore dattiloscritto che sto usando
abbiamo anche aggiungere la piccola annotazione
quindi questo non sarà necessario nel prossimo
versione di dattiloscritto alla prossima versione
quindi annoteremo questo parametro su
Diciamo che vogliamo iniettare il socket
e ER e questo è solo tra i servizi
non da
a due componenti quindi possiamo usare la nostra presa
gestore e ascoltare quando c’è un
cambia quello che succede e quando c’è un
cambiare quello che è successo vogliamo filtrare
attraverso la raccolta di quartieri
che abbiamo filtrato via
nominare così usando il metodo di filtro su un
array ora qui vedo che il tipo è
dicendomi che c’è un errore con
quartiere e quando lo esaminiamo
puoi vedere che c’è una mancata corrispondenza di tipo
quel filtro restituisce un array mentre siamo
mi aspetto un oggetto di quartiere così questo
è un posto in cui è utile il controllo dei tipi
quindi prendi il primo risultato del
array di filtri assicurati che esista
e aggiorna il modello in modo da tornare indietro
alla propagazione dei dati se ricordi in
il nostro evento sul nostro conto conta persone
stavamo aggiornando direttamente il
quartiere come con una funzione setter
ma non è bello perché ora se tu
voglio dire al nostro gestore di socket di puntellare
per inviare quei dati ad altre persone
aprendo l’app il quartiere il
il modello di quartiere deve dirlo a
la presa e questo non è un buon design così
invece quello che faremo è fare
che questo evento dice al componente dell’app
sul cambiamento che dirà il
gestore del quartiere riguardo al cambiamento
e quindi aggiornerà il modello e
il gestore di socket così di nuovo è tutto
sulla propagazione dei dati e sui proprietari
i dati quindi qui aggiorneremo solo il
espressione evento per chiamare un aggiornamento
funzione di quartiere e tutto ciò
la funzione farà sul nostro componente è
chiama il gestore del quartiere e no
combattere per il cambiamento, quindi abbiamo bisogno di a
riferimento alla nostra mano di quartiere
gestore di quartiere che chiamerà
il quartiere di aggiornamento su una funzione su
che implementeremo solo
in questo momento, quindi, quello che farò è il primo
Dillo al socket sul cambiamento in modo che
quindi potrebbe inviare un evento che racconta
altre prese su di esso e poi lo farà
aggiorna anche il modello così ora se apriamo
il nostro nel nostro browser non l’abbiamo detto
angolare sul servizio di gestione socket
quindi lo faremo da
oppure entri nella nostra app componente e
beh, possiamo inserirlo nell’iniettore dell’app
proprio come ender di quartiere ma
concettualmente il gestore di socket non lo è
a livello di componente è sul
livello di bootstrap perché ne vogliamo uno solo
gestore di socket per pagina, quindi faremo appena
mettilo come secondario per il bootstrap
funzione e poi di nuovo possiamo aggiornare
e apri un’altra finestra aprendo la stessa
app e puoi vedere che i dati ottengono
propagato tra i due così siamo arrivati
la nostra demo iniziale che abbiamo mostrato nel
presentazione e anche se si vuole
essere in tempo reale, dobbiamo solo ascoltare
l’evento di input sull’input che è in
html5 e puoi vedere che si propaga
in tempo reale all’altro browser quindi sì
è abbastanza carino ora convertiamolo
questo per padroneggiare 5 quindi quanti di voi
penso che sarà dura solo una volta
è così sarà facile e tu sei
hai ragione, in realtà dovremo farlo
per prima cosa modifica i file di script della scheda su jas
cambia la classe in una funzione e inserisci
i nostri metodi sul prototipo quindi se tu
non ero sicuro di quali fossero i prototipi prima
Penso che ora vedi l’equivalente se
vieni da un mondo dove c’è
classi che dovremo anche fare
rimuovere eventuali informazioni di digitazione e per
il parametro predefinito che stiamo andando
usare l’operatore o che non lo è
Equivalente al 100% ma fa un lavoro
e poi andremo al nostro cambio di socket
da TS UJS cambia la classe in a
funzione e metti i metodi su
prototipo rimuove qualsiasi informazione di battitura
e ora abbiamo anche grasso arif oh abbiamo
abbiamo il calcolo dinamico
nome della proprietà quindi se vi state chiedendo
con quello che era in un concetto sei
questo è l’equivalente collo maestro cinque
e sembra solo meglio in un concetto
sei così e poi c’è l’errore di grasso
funzione che li convertirà a lungo
la forma funziona così molto più caratteri
quindi abbiamo già convertito due dei nostri file
convertiamo il nostro gestore di quartiere
quindi non ci sono importazioni nell’episodio 5 tu
devo solo includere questo file
te stesso o utilizzare qualcosa come yjs così
cambia la funzione in una classe rimuovi
qualsiasi informazione di battitura allora qui abbiamo
questa annotazione che viene iniettata così se
ti stai chiedendo qual è l’equivalente
in ECMO strip 5, un parametro è a
proprietà chiamata parametri sul
funzione che conterrà il parametro
le informazioni di iniezione quindi possiamo
aggiungi i metodi al nostro prototipo qui
continua a cambiare le nostre funzioni di errore in
effettive funzioni di lunga durata e qui noi
stiamo usando questo quartiere ma
nell’atmosfera 5 perdi questo quando tu
crea una nuova funzione ma in errore
funzioni che non è il caso in cui il
il solito trucchetto è fare una barra che sia uguale a questo
angolare sì quindi continueremo
cambiare la funzione a lungo termine in un normale
funzione e aggiungere una dichiarazione di ritorno
perché non ne hai bisogno nel nostro
funzioni ma lo fai nel formato lungo
funzioni ma ora non è cosa che non noi
non devi usare var che è uguale a questo
in realtà possiamo solo fare riferimento al
collezione di quartiere e usarlo come
che sembra un po ‘meglio ora se lo sei
chiedendo l’equivalente di diffusione
superiore del parametro Resta Resta
possiamo usare il prototipo di area
affettato call hack per ottenere tutto il
argomenti come una matrice quindi anche noi possiamo
cambia la funzione di errore e avere
spread operator che stiamo usando su push
possiamo usare quello si applicano invece così ancora
questo è molto sintattico
zucchero che esiste in eccesso di sei e
rimuovere le informazioni di digitazione e il gioco è fatto
con il nostro vicino Hadler c’è
ancora i due componenti hanno lasciato il primo
le persone contano, quindi rimuoviamolo
cambiarlo da tjs e rimuoverlo e cambiarlo
la classe a una funzione rimuove il
digitando le informazioni aggiungi i metodi a
il prototipo
rimuovere le importazioni e ora il
le annotazioni sono una proprietà chiamata
annotazioni sulla funzione e loro
diventare sotto lo spazio dei nomi angolare o
l’oggetto angolare e abbiamo
annotazione aggiunta a loro e noi
da tutto ciò che stavamo importando
il modulo angolare 2 è ora sotto il
oggetto angolare e per dipendenza
iniezione per il nostro costruttore di nuovo
useremo i parametri che diranno
angolare cosa iniettare sul
costruttore e credo che abbiamo finito
qui sì quindi possiamo andare alla nostra app
rimuove i componenti da tjs remove
le importazioni cambiano la classe in una funzione
cambia questo in prototipo e poi noi
avere le annotazioni è come prima
cambiarlo nella proprietà annotation e
aggiungi le informazioni per la dipendenza
iniezione e abbiamo finito la conversione di RL
sono tutti i nostri script di tipo per echo il passaggio 5
abbiamo solo 0 tranne il bootstrap
file per la funzione bootstrap in un file
angolare in ES5 in realtà abbiamo bisogno di
ascoltare quando il cane viene caricato
questo non è il caso di ES6 perché lo siamo
caricandolo tramite il sistema js che lo farà
prenditi cura di quello ma non è il
caso in es5 quindi vai al nostro cambio di indice
la versione angolare a SFX così
mette tutto sulla portata globale
invece di cose da importare dal
modulo dobbiamo anche aggiornare il nostro script
tag perché non stiamo usando alcun fallo
odore e rimuovere il sistema che importa così
ora possiamo aprire a maglia nel nostro browser e
vedere che sta funzionando proprio così ora
facciamo qualcosa di ancora più folle e
convertiamo questo in 1 angolare, quindi per prima cosa
per prima cosa cambieremo la nostra
versione angolare a 1,4 così 1,41 appena ottenuto
rilasciato due giorni fa ma non l’ho fatto
riregistrare tutto in un giorno anche noi
bisogno di cambiare dalla nostra app
definirà il nostro modulo che abbiamo appena inserito
in cima quindi lo definirà con
modulo angolare che non esiste in
angolare 2 ma avrà uno negativo
il nostro sistema modulare così i nostri componenti
è solo una direttiva con il suo nome
il selettore ma il cammello è incastrato e anche questo
ha una limitazione ad essere usato solo come
elementi ha anche un URL modello
che è uguale all’annotazione della vista
quindi abbiamo anche una funzione di collegamento
collegherà nel nostro caso il quartiere
gestire una collezione per esempio al
portata così che sono tutte le informazioni che
possiamo capire che siamo nel nostro
annotazioni di nuovo in modo angolare 1 come
direttive e servizi sono globali
registro che è nel caso in rabbia
troppo cose come l’app injector e
le direttive sono un non possiamo dirlo
non c’è equivalente in nessun altro
quindi c’è questa funzione che ha usato
essere sul nostro componente che stiamo andando
mettere il nostro scopo per comodità e
sì, ci siamo liberati di quei due
c’è ancora il quartiere di spinta
che potremmo mettere sulla nostra direttiva ma
Sento che dovrebbe essere in un blocco di corsa
potrebbe non essere d’accordo, possiamo discuterne
di persona avrai appena ricevuto il servizio
e infine in questo file c’è un
bootstrap che in angolare 1 è
diverso quindi lo diamo effettivamente
nome del modulo sì, questo è tutto per questo file
stiamo andando nel nostro quartiere
gestore che è più facile da convertire in
angolare 1 avremo il nostro modulo ed è
un servizio ovviamente con il
il gestore di quartiere funziona solo
altra differenza qui è che siamo
usando il modello di quartiere che noi
Non voglio che sia globale, quindi lo faremo
iniettarlo nel nostro servizio lo faccia riferimento
proprio lì mettiamo questo in un
invocando immediatamente l’espressione della funzione
quindi non inquiniamo l’ambito globale in
in touch trip non è il caso
perché ogni cosa che definisci in a
modulo non andare all’ambito globale così
abbiamo finito con il gestore del quartiere
il santander è in realtà ancora più semplice
anche un servizio con cui ci registriamo
angolare 1 e abbiamo finito qui possiamo andare
al nostro modello solo indentazione no al nostro
Questo modello potrebbe essere una fabbrica che
restituisce il modello in modo molto semplice
avvolgetelo in un wifey che abbiamo
lo pronunciato comunque e bene questo
non deve essere la fabbrica che possiamo
in realtà lo cambia in un valore che non lo è
comune ma funziona ancora e finalmente siamo
fatto con la nostra cartella di servizio abbiamo solo
conta il nostro popolo, quindi è di nuovo un
modulo angolare che è direttiva che è
in questo caso le persone vengono chiamate così
limitato limitato a un elemento e
ha lo stesso URL modello di una vista
annotazione e facciamolo avere
un ambito seghettato perché è molto
facile da fare in modo da notare che qui in
angolare 1 non abbiamo la scelta ma
utilizzare l’associazione dati bidirezionale a meno che noi
voglio metterlo da parte in modo che
significherebbe che se in quantità simile
cambiamenti nella direttiva lo farà
propagare al genitore ma non lo facciamo
voglio quello perché poi è come l’app
è più difficile sapere cosa sia
cambiando chi sta cambiando cosa siamo
resterò fedele al nostro evento e useremo questo
migliori pratiche quindi avremo il nostro link
funzione e in realtà abbiamo finito
tutte le informazioni che sono nel
annotazioni tranne per il ciclo di vita
che non c’è non ha equivalenti in
angolare 1 quindi dobbiamo calcolare mentalmente
che l’equivalente è in realtà da guardare
la quantità di proprietà e aggiornare il
controllo quindi diamo questo in mente e
rimuovere i nostri orientamenti per ora così dentro
angolare 1 non c’è equivalente a
controlla il tuo è tutto gratis per tutti
quindi per abbastanza per il nostro caso lo faremo
mettilo come un primitivo e di nuovo la vita
il ciclo guarderà invece quale no
esiste nell’angolare 2 e guarderemo il
ammontare la proprietà e aggiornare il nostro controllo
perché altrimenti se ci affidassimo
la nostra quantità di proprietà che avremmo aggiornato
i loro dati genitore che non è qualcosa
vogliamo così finalmente metteremo il nostro telecomando
rapporto sull’importo
montare il metodo ooh scusa si abbiamo messo il nostro
reporter metodo Matt e l’evento
la sintassi è leggermente diversa, non è un
iteratore è solo una funzione che tu
chiama e abbiamo finito con questo così abbiamo solo
convertito il nostro JavaScript da
angolare 2 ad angolare 1 l’unica cosa
quello che rimane è il nostro HTML così in angolare 1
non c’è energia per il modello invece di
controllo energetico il suo modello energetico e anche
non c’è un evento di clic generico che hai
in realtà bisogno di utilizzare un wrapper in
questo caso ng-click e nella nostra app
modello non c’è energia per il suo
ng-ripeti con un po ‘diverso
indice e anche non ci sono parentesi a
dì che c’è un legame, quindi dobbiamo
rimuovilo come puoi vedere
in realtà perdere informazioni con angolare
1 perché ora guardando questo non lo è
ovvio che cosa è un legame che cosa è un evento
devi effettivamente andare alla direttiva
codice per capirlo finalmente qui sì
è così che possiamo andare al nostro browser e
aggiornare e vedere che funziona
tranne che c’è un problema con il
sincronizzazione tra l’importo del componente e
l’importo del modello e questo perché
quando lo stiamo cambiando stiamo ricevendo un
evento dal socket e in angolare 1
dobbiamo dire all’angolare di fare come lo scopo
che si applicano per dirgli di fare lo sporco
controllando che non esista nell’angolare 2
perché abbiamo usato onda GS in modo che ciò accada
automaticamente per te ma per angolare 1
il nostro gestore di socket deve dire angolare
per tornare indietro e il contesto angolare se
così ti inietteremo uno scope di root
perché è un servizio e lo scopo
applica il famoso ambito che si applica e così
ora dovrebbe funzionare così abbiamo appena avuto
la nostra app in angular 2 e dattiloscritto allora
lo convertiamo in un cluster 5 poi noi
convertirlo in angolare 1 e immagino che tu
usa tutta la differenza, quindi abbiamo finito
codifica finalmente, quindi quello che abbiamo imparato è stato
tutto questo bene prima che poi angolare
2 usiamo echamos tip 6 moduli noi
avere il nostro sistema di moduli modello così
ci integriamo molto bene con il
lingua e infine la lingua dà
fa questa roba invece di dover
fare affidamento su requirejs o navigare se lo faccio
di nuovo stiamo usando ECMO step 6 e
dattiloscritto e se siete preoccupati
le aggiunte di pedigree come i tipi
e annotazioni ci sono le proposte
per Ahmed nave 7 per avere queste caratteristiche
quindi è decisamente tutto e anche
un angolare 2 abbiamo questa idea di
componenti che consentono molto di più
isolamento in modo da poterlo simulare
in 1 angolare come abbiamo fatto ma è possibile
anche non simularlo e poi tu sei
difficile mantenere lungo la strada e quindi anche
è molto più dichiarativo così dentro
angolare 1 non ci sono informazioni nel
modello per esempio sui binding
e gli eventi in angolare 2 c’è e
finalmente se ho un consiglio se sei così per ora
se vuoi implementare qualcosa tu
dovrebbe implementare in angolare 1 se sei
costruire un’app di produzione ma se tu
voglio costruirlo in un modo che sarà così
può anche essere facilmente convertito in angolare 2 I
suggerisco di guardare nel controller come
sintassi che consente di prendere
il tuo controller ed esporlo al tuo
portata così in realtà così in angolare 2 noi
non ha menzionato lo scopo di tutto ciò che era
solo dietro le quinte in 1 angolare
fare a meno che non si usi il controller come
anche la sintassi impedisce cose come te
ottieni la notazione a punti che è la migliore
pratica in angolare 1 usando solo a
troller culo così prima di separarsi prima
lasciandomi voglio solo dartene un po ‘
risorse per angular 2 se vuoi
esplora un po ‘di più, ce n’è una bella
buoni post sul blog di Victor che
anche lui fa parte della squadra angolare
ionico ha una piccola introduzione in serie
al pensiero angolare 2 quale percorso
Anche Pascal è una delle persone dietro
ha informazioni ho un post sul blog su di esso
inoltre ho trovato questo blog di questo post da
punte angolari sul motivo per cui 2 rocce angolari e
anche se va anche in molto di più
dettagli e finalmente sento che dovrei
menzionare il repository angolare / angolare
che è dove angolare 2 è essere
sviluppato così
Sento che non è collegato a dire alla gente
semplicemente andare a una storia professionale e leggere il
prova e leggi il codice base si
come impari molto sul framework
anche se hai problemi puoi aprire
è lì e finalmente se vuoi vedere
l’app che si desidera scaricare per l’esecuzione
e così via e vedere così ho il
diverse versioni in diversi rami
quindi è sotto il mio github personale o a
i nomi utente hanno già quello / turisti
in un viaggio e sì se vuoi evitare
questo documento ci è stato detto che puoi farlo su a
app mobile e abbiamo finito così provo ad andare
attraverso questo veloce per avere tempo per
domande ne hanno qualcuno
domande sull’angolare 2 anche
angolare 1 tutto ciò che dovrei sì bene io
non so se hai bisogno di un microfono
la presentazione è sì
ciao quindi devi renderti conto dell’angolare
il tuo servizio in qualche modo così puoi farlo
fallo nell’iniettore dell’app o nel
funzione di bootstrap ma poi di iniettarla
nella tua funzione o nel tuo costruttore sì
devi usare annotazioni con il
parametri ma non sono sorpreso se
le persone svolgono le funzioni di supporto del metodo di supporto
come le librerie che ti aiutano a farlo
anche il prossimo discorso riguarda la dipendenza
Iniezione quindi forse ne hanno di più
informazioni su di esso ma onestamente come te
stavi facendo qualcosa di simile
con l’angolare 1 così eri se lo sei
anche solo lasciandolo analizzare
funzione o fai metterlo in un’area
quindi non è poi così diverso così tanto
angolare 2 la cosa è che funziona molto
di più sui tipi finché ne hai uno
gestire ad esempio un numero di persone
componente sì si può avere in un altro
file definito che le persone contano ha bisogno
questa roba da iniettare in essa
anche se direi che è più difficile
mantenere lungo la strada perché intendo
ogni volta che vuoi cambiare il
dipendenze si devono anche andare un altro
file invece di avere il suo beacon
consolidato in un unico file
alla fine della giornata è JavaScript è
molto flessibile in modo da poter fare cose folli
con l’orientamento angolare siamo tutti
la vita da studente questi non sono consapevoli lo farei
dicono così ciò che è grande è stato angolare 2 è vero
si integra molto bene con la lingua
così solo quando ti inietti qualcosa
gli dai semplicemente una funzione casuale e
in questo di default istanziato
la funzione è nuova ma puoi avere
la tua ricetta in modo da poter dire questo
la funzione jquery in realtà non è altro
che il valore così proprio come un aguilar
uno abbiamo avuto quel valore con il nuovo
sistema di iniezione di dipendenza che hai
cose come legare jquery a jquery e
che lo legherà come valore e io
pensa che nel prossimo stock vedrai
più su questo altre domande si
alcune annotazioni sono ammissibili a parte
dai componenti di qualsiasi altro
lingua per favore c’è anche una direttiva
annotazione così mentre i componenti sono a
componente in un’applicazione una direttiva
è qualcosa che cambia un esistente
elemento come ng4 è anche una direttiva
chiunque potrebbe crearne uno proprio
annotazione è in realtà solo una funzione
questo è messo su un’altra funzione
Non sono sicuro di altre annotazioni
che stiamo usando oltre che iniettare
vista componente sì, è carino
molto credo a qualsiasi altra domanda
sì
la fabbrica
destra
personalmente non lo so, quindi sono un
appaltatore che lavora a distanza per la squadra
quindi in quel momento ero davvero un tempo
differenza di zona è la riunione della squadra
come a mezzanotte quindi non partecipo
in tutti, ma così è dentro
Anteprima dello sviluppatore per un motivo e io sono
non sono sicuro se dentro qualcuno di Google
già iniziando ad usarlo anche se io
non sarei sorpreso se loro lo sapessero
in angolare e la squadra che abbiamo chiesto di avere
abbiamo fatto un hackathon in cui abbiamo solo
costruisci app con angular 2 e metti
sono tutti problemi che non ci piacciono
il framework che vogliamo sistemarti
puoi puoi ben angolare le università
capita di entrare in un paio di giorni a San
Francisco probabilmente ti farai del male qui
altre notizie e vado da loro quindi basta tenere
un occhio su Twitter o qualsiasi altra cosa
carnevale quindi una persona
e
si, probabilmente è lei, è lei
lavorando su di esso quindi sì abituato a lavorare su
sì, c’è materiale angolare che non conosco
sapere se altre librerie di componenti
che sono sviluppati dalla squadra ma io
non sarebbe sorpreso era angolare 2 a
avere un intero ecosistema su di esso perché
è molto più isolato c’è un
molti più standard migliori se si così bene
sì per l’angolare 1 non penso ci sia
qualsiasi eccetto che google tranne che angolare
materiale ma questo è tutto grazie
tu
Please follow and like us: