Amexio Angular Extensions

Browsers support ^{_{made by godban}}

IE / Edge	Firefox	Chrome	Safari	Opera	iOS Safari	Chrome for Android
Edge	last 5 versions	last 5 versions	last 3 versions	last 4 versions	last 3 versions	last 3 versions

Amexio ❤ Bootstrap

We now have support for both the Bootstrap 3.3.7 & Bootstrap 4.0.0 alpha 6

For Documentation Related to both version's use below link

Amexio Bootstrap 3

Amexio Bootstrap 4

Angular CLI - Installation

Overview

The Angular CLI is a tool to initialize, develop, scaffold and maintain Angular applications

Getting Started

To install the Angular CLI:

npm install -g @angular/cli

Generating and serving an Angular project via a development server Create and run a new project:

ng new my-project
cd my-project
ng serve

Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.

For More on Angular CLI commands click on the link.

Amexio Angular Extension - Installation

To install this library, follow the steps given below:

$ cd your-angular-project

For Bootstrap 4

$ npm install amexio-ng-extensions --save

For Bootstrap 3

$ npm install amexio-ng-extensions@1.0.42 --save

Installing Dependencies (Required)

Amexio requires the following libraries to work

1. bootstrap-datepicker
2. bootstrap-timepicker 3) MessengerJS (Growl Notifications)

Include the respective JS & CSS in your app i.e if you are using Angular CLI, add the messenger.js to your "scripts" & the messenger.css & messenger-air-theme.css to your "styles" in .angular-cli.json. If not using cli then simply add it to the index.html head.

and then from your Angular AppModule:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';

// Import your library
import { AmexioWidgetModule } from 'amexio-ng-extensions';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    AmexioWidgetModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Once your library is imported, you can use its components, directives and pipes in your Angular application:

<!-- You can now use your library component in app.component.html -->
<amexio-text-input></amexio-text-input>

Amexio Charting Components

Amexio Charts is provided as a seperate Module as AmexioChartModule available under amexio-ng-extensions/charts To begin please add the module to your Component's Module

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';

// Import your library
import { AmexioChartModule } from 'amexio-ng-extensions\charts';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    AmexioChartModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Once Amexio Charting library is imported, you could use it ,

<!-- You can now use your library component in app.component.html -->
<amexio-chart-column [data]="employeeData"></amexio-chart-column>

Development

To generate all *.js, *.d.ts and *.metadata.json files:

$ npm run build

To lint all *.ts files:

$ npm run lint

Amexio Microsoft Visual Studio Code Extensions

This extension will help the developers of Visual Studio Code with quick code snippet for the Amexio Markup as well as Amexio TypeScript for the Angular Extensions.

Usage

Select the Amexio Ui Component

Fill up the required Component Params

License

Apache 2.0 © MetaMagic Global Inc, 2017. Amexio Angular Extensions

Enjoy!