Passing values using @ViewChild Angular 4

Passing values using @ViewChild Angular 4: @ViewChild in angular is mainly to communicate between parent and child components. Because a component will have access only to its own template files. We have few more components like @Input and @Output for the same. Today we are going to see actually how to pass a value within a same component itself using

347 total views, 1 views today

» Read more

Property binding angular 4 example

Property binding angular 4 example: What is property binding ? Binding html properties like disabled[disabled], class[ngClass] and style[ngStyle] dynamically with component values using angular. You can even create your own custom property using @Input. Syntax: [] Eg: [disabled]   Property binding Types: Element property Component property Directive property In our last tutorial we have seen about event binding and twoway

367 total views, no views today

» Read more

Angular 4 Event Binding + Two Way Databinding Simple Example

Angular 4 Event Binding + Two Way Databinding Simple Example What is Event Binding ? Event Binding in angular adds an event handler which will be triggered on the added event action. For example: <button (click) = “addMe()”> Add Me </button>   Here (click) is a click event in angular binded to addMe() method, so when ever user clicks Add

219 total views, no views today

» Read more

String Interpolation {{}} in Angular 4 – Must to know Things

String Interpolation {{}} in Angular 4 – Must to know Things: String interpolation is basically used to output the values from the typescript file to template file. Whenever you want to dynamically display the values through backends/http requests/from DB then you can make use of this string interpolation to directly output your contents to templates. But know the things mentioned

168 total views, no views today

» Read more

Tools for Angular 4 Developments

As angular 4 becoming very popular, same time typescript and development text editors like atom and sublime is also becoming very popular.   Angular 4 Development Editors & Tools:   1. Microsoft Visual Studio Code It is free from microsoft. Visual Studio Download Link: Download Microsoft Visual Studio Code     2. Atom Atom is text editor from github team.

191 total views, no views today

» Read more

Angular 4 Router Simple Example & Demo

Angular 4 Router Simple Example & Demo: Router is one of the great feature available in angular to bring the content without refreshing the page. Here we are going to have three links namely home, login and register. On click of each link a new content will be displayed only in that particular area without refreshing the full page.  

465 total views, no views today

» Read more

Adding Angular4 + Typescript in Spring STS Eclipse

Today we are going to see how to add angular 4 + typescript 2.2 plugins in eclipse, here spring sts eclipse.   I am assuming you already have spring STS in your machine, if no download it from the below link.   Spring STS Download   Step 1:¬†Open Spring STS       Step 2:¬† Go to Help -> Eclipse

193 total views, 1 views today

» Read more

AngularJS 4 Input Text box Example

AngularJS 4 Input Text box Example: Input text is one of the mostly used component in any form. You can not find a single dynamic website without input text in web applications. Today we are going to see an example on how to use input text in angularjs 4.   Prerequisite: 1. NodeJS and Angular-CLI must be installed, if not

228 total views, no views today

» Read more

If/Else Conditional Statement in AngularJS 4

If/Else Conditional Statement in AngularJS 4: conditional statements are very important in any programming language. Today we are going to see how to use these below conditional statements in angularjs 4. we used ng-template to display the tags/values based on satisfying conditions. 1. If/else 2. If/then 3. If/then/else Official documentation links for your reference: NgIf-directive Official Documentation: NgIf Directive Documentation

127 total views, 1 views today

» Read more

5 Basic things to know in angularjs-cli:

5 Basic things to know in angularjs-cli:   These are the few basic and must know things before starting with angularjs-cli. Assuming node js is installed already, if no please follow the steps in the below link and get it installed,   How to install node js in windows 10 ?     1. Command to install angular-cli:   npm

58 total views, no views today

» Read more
1 2