Angular: Unterschied zwischen den Versionen
(→Icons) |
|||
| (13 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt) | |||
| Zeile 23: | Zeile 23: | ||
[https://stackoverflow.com/questions/42808436/angular-2-input-binding-to-callback-method-reference https://stackoverflow.com/questions/42808436/angular-2-input-binding-to-callback-method-reference] | [https://stackoverflow.com/questions/42808436/angular-2-input-binding-to-callback-method-reference https://stackoverflow.com/questions/42808436/angular-2-input-binding-to-callback-method-reference] | ||
== Change detection == | |||
=== Links === | |||
[https://angular.io/api/core/ChangeDetectorRef https://angular.io/api/core/ChangeDetectorRef] | |||
== Custom Context Menu == | == Custom Context Menu == | ||
| Zeile 31: | Zeile 37: | ||
== Custom Form Controls == | == Custom Form Controls == | ||
[[Custom Select Component (AngularForm)|Custom Select Component]] | |||
=== Links === | === Links === | ||
| Zeile 42: | Zeile 50: | ||
[https://blog.thoughtram.io/angular/2016/07/27/custom-form-controls-in-angular-2.html https://blog.thoughtram.io/angular/2016/07/27/custom-form-controls-in-angular-2.html] | [https://blog.thoughtram.io/angular/2016/07/27/custom-form-controls-in-angular-2.html https://blog.thoughtram.io/angular/2016/07/27/custom-form-controls-in-angular-2.html] | ||
== | == Daten zwischen Komponenten austauschen == | ||
=== Links === | === Links === | ||
[https://angular.io/ | [https://angular.io/guide/component-interaction https://angular.io/guide/component-interaction] | ||
== | == EventEmitter == | ||
=== Links === | === Links === | ||
[https:// | [https://angular.io/api/core/EventEmitter https://angular.io/api/core/EventEmitter] | ||
== | == Icons == | ||
[ | [[Icons FontAwesome (Angular)|Icons FontAwesome]] | ||
== JQuery == | == JQuery == | ||
| Zeile 147: | Zeile 133: | ||
[[Sub-Routing (Angular)|Sub-Routing]] | [[Sub-Routing (Angular)|Sub-Routing]] | ||
== Custom Modal Dialog == | |||
[https://jasonwatmore.com/post/2018/05/25/angular-6-custom-modal-window-dialog-box https://jasonwatmore.com/post/2018/05/25/angular-6-custom-modal-window-dialog-box] | |||
== Styles == | |||
[https://angular.io/guide/component-styles https://angular.io/guide/component-styles] | |||
== Deployment == | |||
[[Deployment Angular]] | |||
== Links == | == Links == | ||
| Zeile 154: | Zeile 152: | ||
== Probleme == | == Probleme == | ||
[[Agular Probeme und Lösungen]] | |||
=== Visual Studio Code is unable to watch for file changes in this large workspace === | === Visual Studio Code is unable to watch for file changes in this large workspace === | ||
Aktuelle Version vom 21. April 2020, 14:47 Uhr
Callbacks
<some-modal-tag [callbackMethod]="parentComponentMethod()"><some-modal-tag/>
@Input: callbackMethod;
onDismiss(){
callbackMethod();
}
parentComponentMethod() {
return () => {
// Your code here
}
}
Links
https://www.bennadel.com/blog/3217-defining-function-and-callback-interfaces-in-typescript.htm
https://octoperf.com/blog/2016/04/03/angular2-typescript-callback-typing/
https://stackoverflow.com/questions/42808436/angular-2-input-binding-to-callback-method-reference
Change detection
Links
https://angular.io/api/core/ChangeDetectorRef
Custom Context Menu
Links
https://medium.com/@sheepczx/how-to-create-a-context-menu-in-angular-2-9c9b502687f1
Custom Form Controls
Links
https://angular.io/api/forms/SelectControlValueAccessor
https://blog.angulartraining.com/tutorial-custom-form-controls-with-angular-22fc31c8c4cc
https://stackoverflow.com/questions/45659742/angular4-no-value-accessor-for-form-control
https://blog.thoughtram.io/angular/2016/07/27/custom-form-controls-in-angular-2.html
Daten zwischen Komponenten austauschen
Links
https://angular.io/guide/component-interaction
EventEmitter
Links
https://angular.io/api/core/EventEmitter
Icons
JQuery
npm install jquery --save
"scripts": [ ... "./node_modules/jquery/dist/jquery.min.js" ... ]
import * as $ from 'jquery';
Links
https://medium.com/@swarnakishore/how-to-include-and-use-jquery-in-angular-cli-project-592e0fe63176
Menü beim Scrollen ausblenden
import { ..., HostListener, ... } from '@angular/core';
prevScrollpos = 0;
...
@HostListener('window:scroll', ['$event'])
scrollHandler(event) {
const currentScrollPos = window.pageYOffset;
if ((currentScrollPos < 55) || (this.prevScrollpos > currentScrollPos)) {
document.getElementById('nav-bar').style.top = '0';
} else {
document.getElementById('nav-bar').style.top = '-50px';
}
this.prevScrollpos = currentScrollPos;
}
#nav-bar {
position: fixed;
top: 0;
left: 0;
width: 100%;
display: block;
transition: top 0.5s;
}
Links
https://www.w3schools.com/howto/howto_js_navbar_hide_scroll.asp
https://angular.io/api/core/HostListener
Routing
Custom Modal Dialog
https://jasonwatmore.com/post/2018/05/25/angular-6-custom-modal-window-dialog-box
Styles
https://angular.io/guide/component-styles
Deployment
Links
https://www.w3schools.com/angular/default.asp
Probleme
Visual Studio Code is unable to watch for file changes in this large workspace
Die Datei sysctl.conf bearbeiten
sudo vi /etc/sysctl.conf
und am Ende folgende Zeile hinzufügen:
fs.inotify.max_user_watches=524288
Danach neuen Wert mit folgenden Befehl laden:
sudo sysctl -p
Neues Limit überprüfen:
cat /proc/sys/fs/inotify/max_user_watches
Zurück zu JavaScript