angular5 directive和component的区别

指令分为三类,组件,属性指令和结构性指令

  • 组件(Component directive):UI组件,继承于Directive
  • 属性指令(Attribute directive):改变组件的样式;
  • 结构指令(Structural directive):改变DOM布局;

属性指令例如 ngClass  ngStyle

结构性指令   *ngIf    *ngFor   *ngSwitch

参考自http://mttcug.cnblogs.com/

时间: 2024-11-04 05:55:59

angular5 directive和component的区别的相关文章

[AngularJS] 'require' prop in Directive or Component

When use 'require', recommend to add some error check, for example: class ChildCtrl { constructor(){ // Get prop from parent ctrl if(this.parentCtrl){ this.childProp = this.parentCtrl.prop; } } } app.directive('someDirective', () => { return { requir

React.createClass和extends Component的区别

React.createClass和extends Component的区别主要在于: 语法区别 propType 和 getDefaultProps 状态的区别 this区别 Mixins 语法区别 React.createClass import React from 'react'; const Contacts = React.createClass({ render() { return ( <div></div> ); } }); export default Cont

@component @bean区别

from: http://stackoverflow.com/questions/10604298/spring-component-versus-bean http://stackoverflow.com/questions/27091553/are-bean-and-component-annotations-the-same-but-for-different-targets-in-sprin @Component and @Bean do two quite different thin

小程序template和component的区别

1.小程序中模板template是不能写事件的,既没有js文件 组件component是可以自定义事件,并且组件有自己的生命周期 2,引入到页面的方式不同 template直接在.wxml页面中引入<import src='components/menu/menu.wxml' /> 需要用的地方这样写 <template is="menu" data="{{icons, iconsSwitch, iconBg}}"> </templat

[Angular Directive] Create a Template Storage Service in Angular 2

You need to define a <template> to be able to use it elsewhere in your app as a TemplateRef. You can store these TemplateRefs in a Service and then access them from any @Directive or @Component in your app. We want to create a service and a componen

[Angular] Implementing A General Communication Mechanism For Directive Interaction

We have modal implement and now we want to implement close functionality. Becuase we use a structure directive to do open modal on click functionality. So as you can see, the directive and modal component is spreated. We need to have some way to comm

[Angular 2] Directive intro and exportAs

First, What is directive, what is the difference between component and directive. For my understanding, component is something like 'canvas', 'form', 'table'... they have the template and their own functionality. It defines how a html tag should work

关于React的Container&amp;Presentational Component模型结构分析

react.js javascript 3 之前翻译了两篇关于Container&Presentational Component模型的文章,一篇是基础的Container和Component的定义,另外一篇是进阶版,因为翻译的太烂,感觉有很多错误,所以只放原文链接. 在这里我想讨论一下我自己对这个模型的一些想法. 注:便于书写,下面统一把Container&Presentational Components模型翻译为容器&展示组件模型 注:下面图片中的components文件夹指

angular directive 自定义指令--属性方式简单学习

1. 自定义指令 - @directive import { Component, Directive, HostListener, ElementRef } from '@angular/core' @Directive({ selector: '[input-trim]', host: { '(keyup)': 'keyUpFunc($event.target)', '(click)': 'onClick($event.target)', 'role-data': 'input-trim'