要在Angular中使用不在组件中的函数,可以通过使用服务来实现。
首先,创建一个新的服务文件,例如 my-service.ts
,并在其中定义一个函数,比如 myFunction()
。
import { Injectable } from '@angular/core';
@Injectable()
export class MyService {
myFunction() {
// 在这里编写函数代码
}
}
然后,在组件中注入并使用该服务。
import { Component } from '@angular/core';
import { MyService } from './my-service';
@Component({
selector: 'app-component',
template: `
`,
providers: [MyService]
})
export class MyComponent {
constructor(public myService: MyService) {}
}
现在,当点击按钮时,将调用 myService.myFunction()
。
请确保在模块中正确引入该服务,以便能够在组件中使用它。
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { MyComponent } from './my-component';
import { MyService } from './my-service';
@NgModule({
imports: [BrowserModule],
declarations: [MyComponent],
providers: [MyService],
bootstrap: [MyComponent]
})
export class AppModule {}
这样,你就可以在Angular中使用不在组件中的函数了。