web:javascript:angular:fundamentals
Différences
Ci-dessous, les différences entre deux révisions de la page.
Les deux révisions précédentesRévision précédenteProchaine révision | Révision précédente | ||
web:javascript:angular:fundamentals [2018/04/01 03:59] – [Tests unitaires] sgariepy | web:javascript:angular:fundamentals [2022/02/02 00:42] (Version actuelle) – modification externe 127.0.0.1 | ||
---|---|---|---|
Ligne 6: | Ligne 6: | ||
====== Démarrer un projet avec Angular CLI ====== | ====== Démarrer un projet avec Angular CLI ====== | ||
+ | |||
+ | Setup: | ||
+ | |||
+ | $ ng set defaults.styleExt scss | ||
+ | | ||
+ | ou bien: | ||
+ | |||
+ | $ ng new my-new-app --style=scss | ||
+ | |||
Démarrer un projet qui s' | Démarrer un projet qui s' | ||
Ligne 18: | Ligne 27: | ||
On peut visiter l' | On peut visiter l' | ||
+ | |||
+ | |||
+ | ===== Utiliser SSL ===== | ||
+ | |||
+ | Dans package.json: | ||
+ | |||
+ | " | ||
+ | |||
+ | |||
+ | |||
+ | ===== Librairie ===== | ||
+ | |||
+ | |||
+ | $ ng generate library | ||
+ | |||
+ | |||
+ | |||
===== Exécuter les tests ===== | ===== Exécuter les tests ===== | ||
Ligne 260: | Ligne 286: | ||
< | < | ||
</ | </ | ||
+ | |||
+ | ===== Titre ===== | ||
+ | |||
+ | Pour modifier le titre du navigateur par rapport à un composant, on peut utiliser '' | ||
+ | |||
+ | <code javascript> | ||
+ | import { Title } from " | ||
+ | ... | ||
+ | }) | ||
+ | export class LoginComponent implements OnInit { | ||
+ | constructor(private title: Title) {} ngOnInit() { | ||
+ | title.setTitle(" | ||
+ | } | ||
+ | } | ||
+ | </ | ||
+ | |||
===== Styliser un composant ===== | ===== Styliser un composant ===== | ||
Ligne 686: | Ligne 728: | ||
<a [routerLink]=" | <a [routerLink]=" | ||
</ | </ | ||
+ | |||
+ | Pour passer des paramètres: | ||
+ | |||
+ | |||
+ | <code html> | ||
+ | <a [routerLink]=" | ||
+ | </ | ||
+ | |||
+ | Sinon, avec le '' | ||
+ | |||
+ | this.router.navigate(['/ | ||
+ | |||
+ | |||
+ | |||
+ | |||
===== Naviguer par le code ===== | ===== Naviguer par le code ===== | ||
Ligne 1262: | Ligne 1319: | ||
Pour d' | Pour d' | ||
+ | |||
+ | |||
+ | ===== Ajout de validateurs ===== | ||
+ | |||
+ | |||
+ | On peut ajouter des validateurs par programmation à un '' | ||
+ | |||
+ | |||
+ | formControl.setValidators([Validators.required, | ||
+ | formControl.updateValueAndValidity(); | ||
+ | |||
+ | |||
+ | Supprimer les validateurs: | ||
+ | |||
+ | formControl.clearValidators(); | ||
+ | |||
Ligne 1651: | Ligne 1724: | ||
let emitter = new EventEmitter(); | let emitter = new EventEmitter(); | ||
+ | |||
+ | |||
+ | |||
+ | ====== Débugger un component dans la console ====== | ||
+ | |||
+ | ng.probe($0).componentInstance | ||
+ | |||
+ | La référence '' | ||
+ | |||
+ | |||
+ | [[https:// | ||
Ligne 1680: | Ligne 1764: | ||
* Rapport d' | * Rapport d' | ||
+ | ===== Installation des dépendances ===== | ||
+ | * npm i -g karma-cli | ||
+ | * npm i karma karma-chrome-launcher karma-jasmine jasmine-core @types/ | ||
+ | Ajouter le fichier '' | ||
+ | karma.conf.js | ||
+ | |||
+ | <code javascript voter.service.spec.ts> | ||
+ | import { VoterService } from ' | ||
+ | import { ISession } from ' | ||
+ | import { Observable } from ' | ||
+ | |||
+ | describe(' | ||
+ | let voterService: | ||
+ | let mockHttp; | ||
+ | |||
+ | beforeEach(() => { | ||
+ | mockHttp = jasmine.createSpyObj(' | ||
+ | voterService = new VoterService(mockHttp); | ||
+ | }); | ||
+ | |||
+ | describe(' | ||
+ | it(' | ||
+ | const session = { id: 6, voters: [' | ||
+ | | ||
+ | mockHttp.delete.and.returnValue(Observable.of(false)); | ||
+ | | ||
+ | voterService.deleteVoter(3, | ||
+ | | ||
+ | expect(session.voters.length).toBe(1); | ||
+ | expect(session.voters[0]).toBe(' | ||
+ | }); | ||
+ | }); | ||
+ | }); | ||
+ | </ | ||
web/javascript/angular/fundamentals.1522547956.txt.gz · Dernière modification : 2022/02/02 00:43 (modification externe)