right-angled

To help you get started, we've collected the most common ways that right-angled is being used within popular public projects.

eastbanctechru / right-angled / src / live-demo / shared / additional-filter / additional-filter.component.ts View on Github

import { Component, OnInit } from '@angular/core';
import { filter } from 'right-angled';

import { AirportsService } from '../data/airports.service';

@Component({
    selector: 'rt-demo-additional-filter',
    styleUrls: ['../filter-area/filter-area.component.scss'],
    templateUrl: 'additional-filter.component.html'
})
export class AdditionalFilterComponent implements OnInit {
    @filter('regionName') public selectedRegion: string = null;
    @filter('countryName') public selectedCountry: string = null;
    @filter('cityName') public selectedCity: string = null;
    public countries: any;
    public cities: any;
    public regions: any;
    constructor(private airportsService: AirportsService) {
    }
    public ngOnInit(): void {
        this.regions = this.airportsService.getRegionLookups();
        this.countries = this.airportsService.getCountryLookups(this.selectedRegion);
        this.cities = this.airportsService.getCityLookups(this.selectedCountry);
    }
    public onRegionChanged(newValue: string): void {
        this.selectedRegion = newValue;
        this.countries = this.airportsService.getCountryLookups(this.selectedRegion);
    }
    public onCountryChanged(newValue: string): void {

View more ways to use right-angled

What is it

right-angled is a lightweight and easy to use angular data grids which integrates with your markup and styles rather than generating its own

Getting started

Check out our demo application at https://eastbanctechru.github.io/right-angled/

Install

npm install right-angled

TL;DR

right-angled is the library for constructing functional data tables (aka data lists, data grids). Also, it has a very useful selection and filter models. They can work even without lists, but they go much better with them. The main feature providing the basis for the library is unobtrusiveness seen in the following:

• The library is not tied to such frameworks as bootstrap and does not include any css styles. It is 100% up to you how the app will be structured and look.
• Minimal impact on your markup. right-angled provides directives instead of components whenever it’s possible. There are only several components in right-angled and they act just as visibility containers without any additional markup. Again, it is 100% up to you how the app will structured and look.
• As a consequence of the above point, right-angled contains minimum of directives and components. It means that you will have to implement some of the components yourself (right-angled provides several useful services which you can inject and use to implement your components easily). Nevertheless, we are sure that creating a new component will give you more pleasure, than learning dozens of options and trying to style an alien one with the markup that cannot be modified.

How to build the project

To build the project, follow these steps:

1. Ensure that NodeJS is installed. This provides the platform on which the build tooling runs.
2. This project is based on angular-cli so you need to install it.
3. From the project folder, execute the following command to install project dependencies:

npm install

3. From the project folder, execute the following command to build the source code:

ng build

How to run tests

You can run tests in Chrome with watch mode by executing the following command:

ng test

or execute single run:

ng test --watch=false