要实现Angular 7中的打印服务,可以按照以下步骤进行操作:
创建一个名为print.service.ts
的新服务文件。
在print.service.ts
中导入所需的依赖项:
import { Injectable } from '@angular/core';
@Injectable
装饰器来标识该类作为一个可注入的服务:@Injectable({
providedIn: 'root'
})
export class PrintService {
constructor() { }
// 打印方法代码将在下一步中添加
}
print
的方法,该方法接受一个字符串参数,表示要打印的内容:print(content: string): void {
let printWindow = window.open('', '_blank');
printWindow.document.open();
printWindow.document.write(`
Print
${content}
`);
printWindow.document.close();
printWindow.print();
printWindow.close();
}
上述代码将创建一个新的浏览器窗口,将打印内容写入其中,并调用浏览器的打印功能。在打印完成后,将关闭该窗口。
PrintService
:import { Component } from '@angular/core';
import { PrintService } from './print.service';
@Component({
selector: 'app-root',
template: `
`
})
export class AppComponent {
constructor(private printService: PrintService) { }
print(): void {
const content = '要打印的内容';
this.printService.print(content);
}
}
在上述代码中,我们在组件的模板中添加了一个按钮,当按钮被点击时,调用print()
方法并传递要打印的内容。
PrintService
添加到providers
数组中:import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';
import { PrintService } from './print.service';
@NgModule({
imports: [BrowserModule],
declarations: [AppComponent],
providers: [PrintService],
bootstrap: [AppComponent]
})
export class AppModule { }
这是一个基本的Angular 7打印服务的示例。你可以根据自己的需求进行修改和扩展。