@namefully/ng

Description

namefully's Angular version. Try it live.

Installation

npm i @namefully/ng

Dependencies

• namefully ^1.2.0

Peer Dependencies

• Angular

Usage

import { Component, NgModule, OnInit } from '@angular/core'
import { BrowserModule } from '@angular/platform-browser'
import { Namefully, NameOrder } from 'namefully'

import { NamefullyModule, NamefullyService } from '@namefully/ng'

@Component({
    selector: 'app-root',
    template: `
        <h1>Welcome to Namefully</h1>
        <p>
            Using component: Hello,
            <ngx-namefully [raw]="name" [method]="'shorten'">! </ngx-namefully>!
        </p>
        <p>Using pipe: Hello, {{ name | namefully : null : 'shorten' }}!</p>
        <p>Using service: Hello, {{ superName.shorten() }}!</p>
        <p>
            Using directive: Hello,
            <span [ngxNamefully]="name" nfMethod="shorten"> </span>!
        </p>
    `,
})
class AppComponent implements OnInit {
    name = 'Mr Smith John Joe PhD'
    superName: Namefully

    constructor(private service: NamefullyService) {}

    ngOnInit(): void {
        this.superName = this.service.build(
            this.name,
            /* override forRoot config here */
        )
    }
}

@NgModule({
    imports: [BrowserModule, NamefullyModule.forRoot({ orderedBy: NameOrder.LAST_NAME })],
    declarations: [AppComponent],
    bootstrap: [AppComponent],
})
export class AppModule {}

Demo

To view a demo:

• clone or download a copy of the repository.
• install the dependencies using npm install
• finally, run npm start

The last command will bootstrap a demo by running a local web server. Use a browser and type the following web address localhost:4200 to load the content.

Read more

As this is a wrapper of the core utility, visit the main page to learn more about its key features, configurations, limitations, and APIs.

Author

Developed by Ralph Florent.

License

The underlying content of this project is licensed under MIT.