DatePipe shortDate format display using US date style MM/dd/yyyy. What to do if we want to display Date using European format dd/MM/yyyy ??? Solution : From Angular2 RC6, you can set default locale in your app module, by adding a provider : The Currency/Date/Number pipes should pick up the locale. You need to import LOCALE_ID […]
forEach() method calls a function for each element in the array. if youhave an Array of elements and you need to call every element and do some treatment you can use forEach. Syntax : callback : Function to test for each element. thisObject : Object to use as this when executing callback Lets see the following example […]
We suppose that we have : And we need to check if the value of X is null or undefined . if we use TypeScript< 2.xx you can do like the following example : Else if you are using TypeScript > 2.0 then you can do like that : If condition with !! to check […]
To set a specific action in button event, we use the event binding syntax. In this post we will see how to set this on a button. Syntaxe : The event binding will listens for the button’s click events and calls the component’s save() method whenever a click occurs. (click) : when the user click […]
*ngIf is used usualy to verify some condition before showing and element in template. In this post we will show you how to use *ngIf with else condition. we will start with creating a div : Now we will add an else block : For more organization : if the condition is TRUE we will […]
How to Share Data between Angular Components ? its a common question asked by angular developers… Data sharing is an essential concept to understand before diving into your first Angular project. In this tutorial, we will show you the most used methods for sharing data between Angular components. Of course , if we talk about […]
La programmation réactive est un paradigme de programmation asynchrone concerné par les flux de données et la propagation du changement. RxJS est une bibliothèque de programmation réactive utilisant des observables qui facilite la composition de code asynchrone. Un opérateur est une fonction qui prend un Observable et renvoie un autre Observable. On peut créer un […]
To deploy and angular (2,8,…10) front-end application with a Spring boot Back-end follow the steps below : 1. Build your angular application First you have to build your front with the command line ng build, for that open a new Terminal in the angular project and run : after running this command , you will […]
If you want to check if the data returned by our service is an Array or a simple object we can use the Array.isArray(**) function Example : here we added [data] when the service returns an object to make sure that we are affecting an array to our dataSource
If you need to insert an HTML element like one <div> or any other element before an existing element in the HTML Document you have to : 1. Get the element by ID : 2. Create the HTML element 3. Insert the element Here we will use insertBefore function to insert the created Div before the recovered Table. If you want […]
If you need to delete an HTML element like one <div> or any other element existing in the HTML Document you have to : 1. Get the element by ID : 2. Delete this element : If you need to insert an HTML element like one <div> or any other element before an existing element , try this simple […]
In this TuTo, we will answer about these questions : When and how to use the NgStyle directive to set an elements style ? When and how to use the NgClass directive to set an elements classes? NgStyle The NgStyle directive lets you set a given DOM elements style properties. in the first example , […]
Put your Angular 8 development skills to the test and see how well you know RxJS library, advanced routing techniques like lazy loading, guarding, or resolvers. It also allows testing if you know how to implement a presentational/container component architecture, when to create services, and how to integrate third-party modules and libraries. Number of Questions […]
if you want to generate a pdf file from datatable / Array or content in HTML Div : run this : 2. import : 3. create the datatable or the content to print in html div: 4. Create a button to generate PDF and put the as click action “generatePdf(contentToConvert)” 5. Finaly past this function […]
Problem : I need to convert an object to a map to get the values of key dynamically Solution : The Map constructor takes an array of key-value pairs. Object.entries is a new Object static method available in ES2017 (19.1.2.5) If you need to support older environments and transpilation is not an option for you, […]
TypeScript follows the same rules as JavaScript for variable declarations. Variables can be declared using: var let const The let declarations follow the same syntax as var declarations. but you have to know that, variables declared with let have a block-scope. Block-scope means that the scope of let variables is limited to their containing block, […]
In HTML : and you can replace the fullDate with any format you like :
Angular 2+ Error !!! “If ngModel is used within a form tag, either the name attribute must be set or the form” Solution : If ngForm is used, all the input fields which have [(ngModel)]=”” must have an attribute name with a value.
The new version of Angular, Angular v10 is officially available since June 25, 2020. With this new update of the framework, the Angular team continues to improve the framework and offers updates to the ecosystem, but also a review of various points that I present to you in this article. Since the release of Angular […]
When developing an Angular application, it is important to understand how components work, including their lifecycle. This lifecycle is managed by Angular, so it’s Angular that will create the component, render it and finally destroy it when necessary. ngOnChanges: it is called when an input is defined or modified from the outside. The status of […]