Skip to content

Commit

Permalink
Updated version & README
Browse files Browse the repository at this point in the history
  • Loading branch information
robisim74 committed Jun 10, 2016
1 parent 50f25b1 commit 55f9edd
Show file tree
Hide file tree
Showing 3 changed files with 31 additions and 53 deletions.
10 changes: 9 additions & 1 deletion .npmignore
Original file line number Diff line number Diff line change
@@ -1,6 +1,14 @@
/node_modules
/typings
/doc

# Dev
*.ts
!*.d.ts
!*.d.ts

# Conf
.gitignore
.npmignore
gulpfile.js
tsconfig.json
typings.json
66 changes: 16 additions & 50 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,23 +2,27 @@
[![npm version](https://badge.fury.io/js/angular2localization.svg)](https://badge.fury.io/js/angular2localization)
> An Angular 2 library to translate messages, dates and numbers.
Sample app built with Angular 2 Material & webpack: [demo](http://robisim74.github.io/angular2localization)
This library is developed using [TypeScript](https://www.typescriptlang.org/) and [Angular 2](https://angular.io/) for i18n and l10n of Angular 2 applications.
It allows, in addition to translation, to localize the numbers and dates of your app, adding language code, country code, and optionally script code, numbering system and calendar, through [Internationalization API](https://developer.mozilla.org/it/docs/Web/JavaScript/Reference/Global_Objects/Intl). It also implements the validation of numbers by locales.
Because it is only a branch of Angular2, the goal is the complete integration with the native solutions of Angular 2.

Get the changelog: [releases](https://github.com/robisim74/angular2localization/releases)
[Sample app](http://robisim74.github.io/angular2localization) built with Angular 2 Material & webpack, and its [source code](https://github.com/robisim74/angular2localization/tree/gh-pages).

## Installation
Get the changelog by [releases](https://github.com/robisim74/angular2localization/releases).

## Installing
You can add `angular2localization` to your project via [Node and npm](https://nodejs.org):
```
npm install --save angular2localization
```

### Loading via SystemJS
To load the package you have two methods using `SystemJS`:
To load the package you have two methods using [SystemJS](https://github.com/systemjs/systemjs):
- Loading the bundle:
```JavaScript
<script src="node_modules/angular2localization/bundles/angular2localization.js"></script>
```
- Using `SystemJS` configuration:
- Using SystemJS configuration:
```JavaScript
var map = {
'app': 'app',
Expand All @@ -34,61 +38,23 @@ var packages = {
```

### Loading via webpack
If you consume the library via `webpack`, simply import the library in your `vendor` file after Angular 2 imports:
If you consume the library via [webpack](https://webpack.github.io/), simply import the library in your `vendor` file after Angular 2 imports:
```TypeScript
import 'angular2localization/angular2localization';
```

## Getting the translation
This library uses pure pipes. To know the advantages over impure pipes, please see [here](https://angular.io/docs/ts/latest/guide/pipes.html).

Type | Format | Syntax
---- | ------ | ------
Message | String | `expression | translate:lang`
Date | Date/Number | `expression | localedate[:defaultLocale[:format]]`
Number | Decimal | `expression | localedecimal[:defaultLocale:[digitInfo]]`
Number | Percentage | `expression | localepercent[:defaultLocale:[digitInfo]]`
Number | Currency | `expression | localecurrency[:defaultLocale[:currency[:symbolDisplay[:digitInfo]]]]`

To know the full use, see the [Wiki](https://github.com/robisim74/angular2localization/wiki/Getting-the-translation) page.

## Scenarios
Scenario | Scope of | Wiki page
-------- | -------- | ---------
First | You need to localize dates and numbers, but no messages | [Wiki](https://github.com/robisim74/angular2localization/wiki/First-scenario)
Second | You only need to translate messages | [Wiki](https://github.com/robisim74/angular2localization/wiki/Second-scenario)
Third | You need to translate messages, dates and numbers | [Wiki](https://github.com/robisim74/angular2localization/wiki/Third-scenario)

## Defining default locale
In the first & third scenario, you can define the default locale to set the language and country, the script, the numbering system and calendar:
[Wiki](https://github.com/robisim74/angular2localization/wiki/Defining-default-locale).

## Validation by locales
Type | Directive | Validator | Options | Errors | Wiki page
---- | --------- | --------- | ------- | ------ | ---------
Number | `LocaleNumberValidator` | `validateLocaleNumber=[digitInfo]` | `[minValue]` `[maxValue]` | `format` or `minValue` or `maxValue` | [Wiki](https://github.com/robisim74/angular2localization/wiki/Number-validation)

## Internationalization API
To localize dates and numbers, this library uses `Intl` API, through Angular 2.
All modern browsers, except Safari, have implemented this API. You can use [Intl.js](https://github.com/andyearnshaw/Intl.js) to extend support to all browsers.
Just add one script tag in your `index.html`:
```Html
<script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=Intl.~locale.en-US"></script>
```
When specifying the `features`, you have to specify what locale, or locales to load.

*N.B. When a feature is not supported, however, for example in older browsers, `angular2localization` does not generate an error in the browser, but returns the value without performing operations.*
## Usage
See [library specification](https://github.com/robisim74/angular2localization/blob/master/doc/spec.md).

## Boilerplates
## Related projects
[Angular 2 Localization with an ASP.NET CORE MVC Service](https://damienbod.com/2016/04/29/angular-2-localization-with-an-asp-net-core-mvc-service/) @damienbod

## Contributing
Clone or download this repository.
## Building
In order to build the library, clone or download the latest version of this repository:
```
npm install
typings install
tsc
gulp
npm run build
```
To test locally the npm package:
```
Expand Down
8 changes: 6 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,9 +1,13 @@
{
"name": "angular2localization",
"version": "0.8.2",
"version": "0.8.3",
"description": "An Angular 2 library to translate messages, dates and numbers",
"main": "angular2localization.js",
"scripts": {},
"scripts": {
"build": "npm run tsc && npm run gulp",
"tsc": "tsc",
"gulp": "gulp"
},
"typings": "./angular2localization.d.ts",
"keywords": [
"Angular2",
Expand Down

0 comments on commit 55f9edd

Please sign in to comment.