@acknow-srl/title 中文文档教程

Question

Title

允许您为您的应用程序配置一个通用标题，带有可选的可变部分。

AckTitleModule (Module)

Methods

• forRoot(config: AckTitleConfig): void: configures the format for the title.

AckTitleConfig (Interface)

• format (string): Title format. You can use {{TITLE}} placeholder to change the title variable part based on the page/route.

AckTitle (Service)

它在 root 中提供，因此它对整个应用程序可用。

Methods

• get(): string: Returns the title.
• set(title: string): void: Sets the title variable part, according to the configured format.

Example

/**
 * 1. Import the module and the configuration model in your main module (usually app.module.ts).
 */

import { AckTitleModule, AckTitleConfig } from '@acknow-srl/title';

/**
 * 2. Add the module to your app imports and configure it.
 */

// By using this format, {{TITLE}} will be the title variable part. Any component can override it using AckTitle.set() method.

const config: AckTitleConfig = {format: '{{TITLE}} - My app name'};

@NgModule({
  declarations: [
    AppComponent
    ...
  ],
  imports: [
    ...
    AckTitleModule.forRoot(config),
    ...
  ],
  bootstrap: [AppComponent]
})
export class AppModule {
}

/**
 * 3. Implement AckTitle service in your components.
 */

import { Component, OnInit } from '@angular/core';

import { AckTitle } from '@acknow-srl/title';

@Component({
    selector: 'my-component',
    templateUrl: 'my-component.html',
    styleUrls: ['my-component.css']
})
export class MyComponent implements OnInit {

    constructor(private _title: AckTitle) {
    }

    ngOnInit() {

        // The content for the HTML <title> tag will be: 'My component title - My app name'.

        this._title.set('My component title');

    }

}