Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • Use of @Output in Angular2 with demo

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 243
    Comment on it

    Hello Readers,

    In today's blog we will discuss about @Output decorator in Angular2 component.


    Introduction: Angular2 is totally based on component and written in Typescript. In Angular1 we are using Controller, $scope but they not longer used in Angular2. Controller and $scope is replaced by Component and Directive in Angular2.

     

    Here is the full Example of ionic2 and Angular2.

    First of all we need to install Ionic2. To installation Click Here. After install we will start using of @Output.

    home.html

    <ion-header>
      <ion-navbar>
        <ion-title>Home</ion-title>
      </ion-navbar>
    </ion-header>
    
    <ion-content padding class="home">
      <myapp>{{name}}</myapp>  
    </ion-content>
    

    home.ts

    import {Component,Output} from '@angular/core';
    import {NavController} from 'ionic-angular';
    
    	@Component({
    	        selector:'myapp',
    		templateUrl: 'build/pages/home/home.html'
    	})
    	export class HomePage {
    		@Output() name = "Ionic2"; 
    		constructor(private navController: NavController) {
    			
    		}
    	}
    

    In home.ts we are using @output component. To use this we need to import it.

    It is very easy to implement. Hope this will help you :)

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: