Angular 独立组件

52 阅读1分钟

独立组件提供了一种简化的方式来创建Angular应用程序。独立组件,指令和管道通过减少对ngModule的需求来简化创作体验,现有应用程序可以选择性地以增量方式采用新的独立风格,而不需要大量的改动。

独立组件可以指定他们的依赖项,而不需要通过ngModule来获取他们。
可以在ngModule1imports 中引用独立组件。如下图中的“PhotoGalleryComponent”,这样项目不需要做任何改动,就可以在现有工程中使用到独立组件。 不 image.png

独立组件中引用独立组件,也是通过imports

@Component({
  standalone:true,
  selector: 'app-photo-gallery',
  templateUrl: './photo-gallery.component.html',
  styleUrls: ['./photo-gallery.component.css'],
  imports:[PhotoAppComponent],
})
export class PhotoGalleryComponent implements OnInit {
  constructor() { }
  ngOnInit() {
  }
}

这里引用了组件PhotoAppComponent该组件并未在ngModel中引用,也可以在PhotoGalleryComponent中正常使用。