要在Angular 16中使用选择器,您需要遵循以下步骤:
创建一个新的组件,命名为my-component
。您可以使用Angular CLI命令来创建组件:ng generate component my-component
。
在my-component.component.ts
文件中,定义组件的选择器。例如,您可以将选择器设置为app-my-component
。
import { Component } from '@angular/core';
@Component({
selector: 'app-my-component',
templateUrl: './my-component.component.html',
styleUrls: ['./my-component.component.css']
})
export class MyComponentComponent { }
app.component.html
文件中,使用选择器来引用my-component
组件。例如,您可以在app.component.html
中添加以下代码:
app.module.ts
文件中将MyComponentComponent
添加到declarations
数组中,以便在应用程序中正确引用组件。import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';
import { MyComponentComponent } from './my-component/my-component.component';
@NgModule({
declarations: [
AppComponent,
MyComponentComponent
],
imports: [
BrowserModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
这样,my-component
组件就会被添加到app.component.html
中,并在应用程序中显示出来。