Getting Started

Fomantic UI Angular 7 Integrations, written in pure Angular - no JQuery required.

Introduction

Angular and jQuery don't go together - this is the fundamental principal of this library. It provides Angular component versions of the Fomantic UI modules, so that you don't need to add jQuery to your app.

Note that only Fomantic UI elements that use jQuery are recreated here - those written purely in CSS aren't included as they can be used in Angular apps already.

Installation

To install this library, run:

$ npm install ngx-fomantic-ui --save

Next include the Fomantic UI CSS file in your index.html (you can include a manually compiled one if you use themes):

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fomantic-ui@2.7.5/dist/semantic.min.css">

Once installed you need to import the main module:

import {FomanticUIModule} from 'ngx-fomantic-ui';

Finally import the main module into your application module:

import {FomanticUIModule} from 'ngx-fomantic-ui';

@NgModule({
    declarations: [AppComponent, ...],
    imports: [FomanticUIModule, ...],
    bootstrap: [AppComponent]
})
export class AppModule {}

N.B. you can import individual component modules:

import {FuiCheckboxModule, FuiRatingModule} from 'ngx-fomantic-ui';

Now you're good to go!

Note if you're using SystemJS, add the following to your systemjs.config.js file:

var config = {
    ...
    map: {
        ...
        'ngx-fomantic-ui': 'npm:ngx-fomantic-ui/bundles/ngx-fomantic-ui.umd.min.js'
    }
}

Dependencies