Outils du site
Est-il Dieu possible, en pleine mouvance des droits de la femme, que des bougresses se plient encore aux ordres fascisants d'une espèce de Ubu prostatique de la mode, qui au lieu de crever de honte dans son anachronisme, continue de leur imposer le carcan chiffonneux de ses fantasmes étriqués, et cela, jusqu'au fin fond populaire de nos plus mornes Prisunic ? Je t'en prie, ma femme, ma soeur, mon amour, mets ton jean, ou reste nue, mais ne marche pas dans la mode, ça porte malheur. [Pierre Desproges]
Panneau latéral
56-tools:angular
Ceci est une ancienne révision du document !
Table des matières
Angular
Angular client
Angular with Pug
Ressources
https://blog.angularindepth.com/
https://material.angular.io/components/categories
test dialog: https://stackblitz.com/edit/angular-sqspai?file=app%2Fdialog-overview-example-dialog.html
Tri table example
Data binding
[(ngModel)] | Two-way data binding. |
[property] | Property binding. |
(event) | Event binding |
Interpolation
{{variable}} interpolation. Les deux formes ci-dessous sont équivalentes:
<img src=“{{heroImageUrl}}”> is the interpolated image.<img [src]=“heroImageUrl”> is the property bound image.
Property binding [property]
It flows a value in one direction, from a component's data property into a target element property.
You cannot use property binding to pull values out of the target element.
You can't bind to a property of the target element to read it. You can only set it.
Event binding (event)
Les deux formes ci-dessous sont équivalentes:
<button (click)=“onSave()”>Save</button><button on-click=“onSave()”>Save</button>
two-way data binding [(ngModel)]
You often want to both display a data property and update that property when the user makes changes.
Template reference variables ( #var )
variable locale qui peut être utilisée par la suite :
<input #phone placeholder="phone number"> <!-- phone refers to the input element; pass its `value` to an event handler --> <button (click)="callPhone(phone.value)">Call</button>
Input and Output properties
An Input property is a settable property annotated with an @Input() decorator. Values flow into the property when it is data bound with a property binding [property].
Exemple:
- Declaration:
@Input() hero: Hero; - Usage:
<app-hero-detail [hero]=“selectedHero”></app-hero-detail> - Autre forme d'écriture:
bind-hero=“selectedHero”
An Output property is an observable property annotated with an @Output() decorator. The property almost always returns an Angular EventEmitter. Values flow out of the component as events bound with an event binding (event).
Components
Remember that all components are directives.
Directives
There are three kinds of directives in Angular:
- Components directives: with a template.
- Structural directives: change the DOM layout by adding and removing DOM elements.
- Attribute directives: change the appearance or behavior of an element, component, or another directive.
Testing
https://psamsotha.github.io/angular/2016/12/16/angular2-testing-karma-systemjs.html
https://jasmine.github.io/api/edge/matchers.html
https://github.com/mgechev/angular-performance-checklist
https://blog.oasisdigital.com/2017/angular-runtime-performance-guide/
Exemples et tests
Dernière modification : 2018/04/04 02:03