angular 2 components vs directives

Angular 2 components vs directives

Angular 2 components vs directives
                        
1.       @Component meta-data annotation is used  to register the components.
@Directive meta-data annotation is used  to register the directives.
2.       The components are used to create UI widgets.
The directives are used to add behavior to existing DOM elements.

3.       The components are used to split to application into smaller parts.
The directives are use to design a reusable components.
4.       Only one component is used per DOM element.
More than one directive are used per DOM element.
5.       In the components, @View, template and templateUrl are mandatory in the components.
The directive do not have @View etc.


Example for using Component.
    import {Component, View} from 'angular2/core';

    @Component({
       selector: 'hello-world'
    })

    @View({
       template: "<h1>Hello  {{angular}}</h1>"
    })

    class hello {
        constructor(public angular: string) {}
    }

    <hello-world></hello-world>

Example for using Directive.
import {Component, View} from 'angular2/core'';

@Component({
    selector: 'user-detail'
})

@View({
    template: "<div> <h1>{{userName}}</h1> <p>{{phone}}</p>"
})
class userDetail {
    constructor(public userName: string, public phone: string) {}
}


<user-detail></user-detail>



For more detail, go to link
http://stackoverflow.com/questions/32680244/directive-v-s-component-in-angular2



ANIL SINGH

Hey! I'm Anil Singh. I author this blog. I'm Active Blogger, Programmer. I love learning new technologies, programming, blogging and participating the forum discussions more...
My Blogs - http://www.code-sample.com and http://www.code-sample.xyz
My Books - Buy Books Online at Best Prices

You Might Also Like
Post a Comment
www.code-sample.com/. Powered by Blogger.