18.0.8 • Published 12 months ago

@gunnaway/ngx-translate-cut v18.0.8

Weekly downloads
-
License
MIT
Repository
github
Last release
12 months ago

✂️🌍 NgxTranslateCut Pipe

npm version Package License Build & Publish NPM Downloads codecov

Angular pipe for cutting translations ✂️ 🌍 (plugin for @ngx-translate)

Angular 18, Ivy, Angular Universal (SSR) and Zoneless compatible

Here's the demo or stackblitz live preview

Install

  1. Make sure you have @ngx-translate library installed, because this is its plugin

  2. Use npm (or yarn) to install the package

npm install ngx-translate-cut # For Angular 18. See compatibility table

Choose the version corresponding to your Angular version:

Angularngx-translate-cutInstall
ng1818.xnpm install ngx-translate-cut
ng1717.xnpm install ngx-translate-cut@17
ng165.xnpm install ngx-translate-cut@5
ng154.xnpm install ngx-translate-cut@4
ng143.xnpm install ngx-translate-cut@3
ng133.xnpm install ngx-translate-cut@3
ng12 (ivy only)2.xnpm install ngx-translate-cut@2
>= 5 =< 121.xnpm install ngx-translate-cut@1
  1. Add NgxTranslateCutModule into your module imports.

File app.module.ts

  import { NgxTranslateCutModule } from 'ngx-translate-cut';

  @NgModule({
   // ...
   imports: [
     // ...
     NgxTranslateCutModule
   ]
  })

Usage

Definition

Strings are separated with | (pipe sign) ...but you can choose your own symbol

File assets/i18n/en.json

{
  "demo": "This is only one 'translate string' with | strong text | and | links"
}

Example code

In your template use translateCut:<number> pipe right after translate pipe from @ngx-translate library.

{{ 'demo' | translate | translateCut:0 }}

<strong> {{ 'demo' | translate | translateCut:1 }} </strong>

{{ 'demo' | translate | translateCut:2 }}

<a href="#"> {{ 'demo' | translate | translateCut:3 }} </a>

Result

This is only one 'translate string' with strong text and links

Options

If you are not satisfied with the basic settings of the separator (which is |), you can choose your own separator

  import { NgxTranslateCutModule } from 'ngx-translate-cut';

  @NgModule({
   // ...
   imports: [
     // ...
     NgxTranslateCutModule.forRoot({
      // Your separator in translation strings will be `*`
      separator: '*'
    }),
   ]
  })

Dependencies

@ngx-translate/core

FAQ

Older Angular

Error

Failed to compile.

./node_modules/ngx-translate-cut/fesm2015/ngx-translate-cut.mjs 17:18-28 Can't import the named export 'Injectable' from non EcmaScript module (only default export is available)

Solution

You are probably trying to use this library with an older version of Angular (Angular 5 – 11).

Install copmatibility version instead:

yarn add ngx-translate-cut@1 # for angular 5 – 11

Development (notes for me)

Publish Stable

yarn release:patch
# yarn release:minor
# yarn release:major

Publish next channel

  1. Bump version -next.0 in package.json
  2. yarn publish:next

License

Copyright © 2023 Lukas Bartak

Proudly powered by nature 🗻, wind 💨, tea 🍵 and beer 🍺 ;)

All contents are licensed under the MIT license.

Donation

If this project have helped you save time please consider making a donation for some 🍺 or 🍵 ;)

Thanks to

Original idea comes from: @yuristsepaniuk in this thread.

18.0.8

12 months ago

18.0.7

12 months ago

18.0.6

12 months ago

18.0.5

12 months ago

18.0.4

12 months ago

18.0.3

12 months ago

18.0.2

12 months ago

18.0.1

12 months ago

18.0.0

1 year ago

4.0.6

2 years ago

4.0.5

2 years ago

4.0.4

2 years ago

4.0.3

2 years ago

4.0.2

2 years ago