CODEWITHSUNDEEP
angularionic-framework
kumkum kumkum
kumkum kumkum

Reputation: 109

How to use Ionic components in existing angular project

Intially I have an angular project where I have used Angular Material, later I have added the Ionic Framework by this process(https://stack247.wordpress.com/2019/03/11/integrate-ionic-in-existing-angular-project/), but I am not able use Ionic components, even the console is not displaying any errors.

my app.module.ts

  import { IonicModule } from '@ionic/angular';

  imports[IonicModule]

HTML:

  <ion-badge color="primary">11</ion-badge>

Upvotes: 0

Views: 1449

Answers (2)

Khurshid Ansari
Khurshid Ansari

Reputation: 5075

You can include ionic library in angular by following command:

npm install @ionic/angular@latest --save

ref https://ionicframework.com/docs/intro/cdn#ionic-angular

Upvotes: 0

MadMac
MadMac

Reputation: 4851

To use Ionic components in an existing Angular project. Two easy steps:

  1. Add schemas: [ CUSTOM_ELEMENTS_SCHEMA ] to your module (app.module.ts)

Like so:

import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';
@NgModule({
  imports:      [ BrowserModule],
  declarations: [ AppComponent],
  bootstrap:    [ AppComponent ],
  schemas:      [ CUSTOM_ELEMENTS_SCHEMA ]
})
export class AppModule { }
  1. Add a link to the CDN in your index.html

<script src="https://unpkg.com/@ionic/[email protected]/dist/ionic.js"></script>

Upvotes: 1

Related Questions