Ionic 原生组件与 Angular 自定义组件

Question

我已经使用 this article.It's working fine.Can you tell me what is the difference between angular custom component and native ionic component like ion-range?

创建了 angular 进度条组件

自定义angular组件：

import { Component, Input } from '@angular/core';

@Component({
  selector: 'progress-bar',
  templateUrl: 'progress-bar.html'
})
export class ProgressBarComponent {

  @Input('progress') progress;

  constructor() {

  }

}

Answer 1

真的没什么区别。 Ionic 建立在 angular 之上。所有特定的离子组件都是使用 angular 组件装饰器构建的。 ion-range 这样的组件实际上是 ionic-angular 模块中的 Angular 组件。

如果您检查链接的来源，它显示为：

@Component({
  selector: 'ion-range',
  template: '<!-- custom html here -->'

  providers: [ { provide: NG_VALUE_ACCESSOR, useExisting: Range, multi: true } ],
  encapsulation: ViewEncapsulation.None,
})
export class Range extends BaseInput<any> implements AfterContentInit, ControlValueAccessor, OnDestroy {
//..
}

每个离子组件的输入属性是使用 angular 的 @input() 定义的，所有输出事件如 ionChange 都是使用 Angular 定义的s EventEmitter.

Ionic 原生组件与 Angular 自定义组件

Ionic native component vs Angular custom component

components

ionic-framework

ionic2

ionic3

angular