AngularJs组件（Component）

JavaScript09

AngularJs组件（Component）,第1张

组件负责控制屏幕上的一小块地方，我们称之为视图。

我们在类中定义组件的应用逻辑（它被用来为视图提供支持）。组件通过一些由属性和方法组成的API与视图交互。

例如：

HeroListComponent有一个 heroes属性，它返回一个“英雄”数组，这个数组是由一个服务的。 HeroListComponent

还有一个 selectHero()方法，当用户从列表中点选一个英雄时，就把它 / 她设置到 selectedHero属性。

export class HeroListComponent implements OnInit {

heroes: Hero[]

selectedHero: Hero

constructor(private service: HeroService) { }

ngOnInit() {

this.heroes = this.service.getHeroes()

}

selectHero(hero: Hero) { this.selectedHero = hero}

}

当用户在这个应用中“移动”时，Angular会创建、更新和销毁组件，本应用的可以通过生命周期钩子在组件生命周期的各个时间点上插上自己的操作，比如上面的声的ngOnInit()

小程序js中引入组件如一下步骤：

1、准备好外部想要引入的外部文件，命名为util.js，并且填充固定的文件内容（一般是固定的库）。

2、打开util.js，继续填写重要内容将要使用的方法用module.exports给暴露出来。

3、将外部js放在指定的文件夹utils里（utils规定存放js库和数字格式化文件）。

4、在想要用到这个方法的js里面require这个js，然后调用即可。