Angular animation document give some very good example to add the animation in component but it looks messy. What if we want to keep all the animation in separate file and use wherever we want. Keeping all animation in a separate file will be good idea because it will be easy to maintain and reuse the same animation as many times as we want. In this article we will create some basic animation... By Ali Adravi On 27 Mar 2018 Viewed: 3,088
Constructor is a special method, having the same name as the class/struct. When an object of class or struct is created, its constructor is called, and they usually used to initialize the data members of the new object. There are different types of constructors which we will see in detail in this article, like, default constructor, parameterized constructor, copy constructor, static constructor... By Ali Adravi On 14 Feb 2018 Viewed: 2,705
Angular email validation can be done in many different ways, by using the built-in directive, by using patterns or by creating custom directive. In this article we will try to see all the three different ways with working code in plunker. We will use our previous example and add three email text boxes to validate 1. by built-in directive, 2. by using pattern and finally we will write our own... By Ali Adravi On 23 Jan 2018 Viewed: 16,274
Angular make form validation easier than ever, we are going to check with Angular FormBuilder, FormGroup and validation together in this article, We will also see how to validate email without writing any custom directive or any other code because it is already there. Some tricky way to show and hide the error on page load and on save. We will use plunker for example: First we need to update... By Ali Adravi On 23 Jan 2018 Viewed: 3,648
Angularjs jquery calendar with minimum code to attach datepicker, how to extend to restrict the dates from a particular day, month or year, how to make calendar to validate start and end date from one control to other after user selection, how to format date before rendering or how to disable datepicker with the help of angular ngDisabled properties are some of the common points we are going to... By Ali Adravi On 26 Dec 2017 Viewed: 5,106
Angularjs 1.5 introduced component which can be used for reuseable component similar to user control in ASP.Net. We will create a component and see how we can use with different pages by just adding a single element. If we will try to creat the same as a directive then will be complicated but with component it will be very easy. **Advantages of Components**: - simpler configuration than... By Ali Adravi On 23 Oct 2017 Viewed: 2,606
Checkbox list at least one is required, checkbox list minimum 3 is required, gender at least one is required are the basic requirement for any situation. We will use the toggle trick to add remove the selected items from the list of checkbox values. In this article we are going to see the examples: 1- Radiobutton list, at least one value is required 2- Checkbox list, at least one value... By Ali Adravi On 22 Oct 2017 Viewed: 7,755
Multiple submit button in ASP.Net MVC is the common and mostly asked question in interview. In this article we will try to see different ways to use the Multiple submit button in a form and what is the best way to use multiple submit button. What we are going to try: 1. HTML5 FormAction and FormMethod attribute in submit buttons 2. Multiple Submit Buttons With Action Selector Attribute 3.... By Ali Adravi On 08 Oct 2017 Viewed: 6,777
Dynamic table rendering, edititing, adding/removing rows with angularjs, render any json script in tabular format with heading and contents. W will try to render dynamic table, add & remove rows, edit rows in table all by very simple coding, hardly two to five lines, don't allow to remove the first row and keep the add button always in the last row etc. 1. Angularjs Render any json array to... By Ali Adravi On 07 Oct 2017 Viewed: 8,456
@Input and @Output decorator ar used to pass data/communicate between components, @input is used to pass data from parent to child component on the other hand @Output is use to notify the parent by using EventEmitter. Take the simple example of customers list parent page and add/edit child component, on clicking the edit button current customer data need to be passed to the child component to... By Ali Adravi On 30 Sep 2017 Viewed: 2,089
Upload file with data by clicking on button or by drag and drop, is the topic of this article. We will try to create an image gallery by uploading files and save data into database and images into a folder. We will try to create a component in a way that it can be used anywhere in entire application and configure properties like file size, type of files, single or multiple files, maximum number... By Ali Adravi On 24 Sep 2017 Viewed: 40,946
Token base authentication with custom database by using OAuth in Web API is not complicated but documents are not very clear, many people try it and ended up with scratching their head, but you are on the right page so you will not be one of them. It is not required to create an empty project and only then you can implement it, you can create a Web API Application and add the code provided in... By Ali Adravi On 11 Sep 2017 Viewed: 17,445
Angular 2 insert update, delete, search, sort feature we will try in this article which we will improve with dynamic component loading and image upload with drag and drop feature in coming articles with the same base code. We are going to use Angular-CLI 4 for this application. What we need to start: - Node version 6.x - Any code editor, I use Visual Studio Code, it is free - Angular... By Ali Adravi On 03 Sep 2017 Viewed: 25,690
Angular 2 gives full control to add or remove component in other component programmatically by simple steps. In this article we are going to see how to add, remove experience component to any other component, we will also try to pass some values to component from parent to child component to see if it is possible or not. It's better to write on plunker so we can test at anytime from... By Ali Adravi On 27 Aug 2017 Viewed: 50,201
What is ASP.Net Web API, what is RESTFul service, What is the difference between WCF and Web API and when to use over other. These are the main points which we going to discuss in this starting article, then we will create our own Web API project and look each and every single type of methods like get, post, put, delete. We will also use the Entity Framework to get and post the data to SQL... By Ali Adravi On 13 Jul 2017 Viewed: 1,360
Createing accordion demo in Angular 2 is more than easy, Angular have rich of conditional features which we will see in this article, like how to apply more than one class on the basis of some conditional values. For this demo we are not goign to write some fancy CSS and animation but use the hard coded data and use ngFor loop and index to create dynamically our list of items in accordion and... By Ali Adravi On 19 May 2017 Viewed: 11,837
In angular 2 we don't have pre-defined filter and order by as it was with AngularJs, we need to create it for our requirements. It is time killing but we need to do it, (see [No FilterPipe or OrderByPipe][1]). In this article we are going to see how we can create filter called pipe in angular 2 and sorting feature called Order By. Let's use a simple dummy json data array for it. Here is the json... By Ali Adravi On 16 Apr 2017 Viewed: 83,502
Angular 2 have a built-in service called Title, while in angularjs or angular 1 we were maintaining it through the routing or through the service. By using the Title service provided by Angular 2, in 2 minute every thing will be set without any complication, even we don't need to understand the login behind it. Enough talked let's see what we need and how to set it. 1. We don't need to... By Ali Adravi On 14 Apr 2017 Viewed: 5,012
Angularjs Filter is very really handing when we need to filter records from a complex object array. I was looking Angular way to filter my records and found some interesting things from different websites, which I will try to summarise and explain in more detain in this article. We will see how to use filter in ngRepeat, ngOption and inside our controller because using filter in controller is a... By Ali Adravi On 30 Jan 2017 Viewed: 22,996
Validation of controls in ng-repeat is really easy, just we need a unique name for every control. I found many articles which use ngMessage but they validate all the controls together, if there is any invalid control, all the controls say the error message. I was in need to explore and try different tricks and found one easy way, which I want to share to same others time. In this article we are... By Ali Adravi On 20 Jan 2017 Viewed: 5,516