Ionic 2 Projects: using primeng with ionic 2


#1

integration de primeng / primeui in ionic 2 application
at root application add modules run :

npm install primeui --save
npm install primeng --save

in www/index.html:
add before :


this code:



  • after :

  • add :


**tips for Calendar Component** **replace** in file primeui-ng-all.min.js : *datepicker_getZindex($(e))+1* **by** datepicker_getZindex($(e))+999

Now You can use sample code:

import {Page,Platform,MenuController} from 'ionic-angular';
import {Calendar} from 'primeng/primeng';


@Page({
  templateUrl: 'build/pages/page1/page1.html',
  directives: [Calendar]
})
export class Page1 {
  dateValue:any;
  ....
  
  constructor(platform: Platform, menu: MenuController) {
    this.dateValue = '';
    .......
 
  }
}

ATTENTION
You must create in node_modules directory ionic-gulp-primeui-copy with file index.js :
content :

var gulp = require('gulp');

var defaultSrc = [
    'node_modules/primeui/**/*.*'
];

module.exports = function(options) {
  options.src = options.src || defaultSrc;
  options.dest = options.dest || 'www/build/js/primeui';

  return gulp.src(options.src)
    .pipe(gulp.dest(options.dest));
}

MODIFY gulp.js
ADD

var copyPrimeui = require('ionic-gulp-primeui-copy');
...
gulp.task('primeui', copyPrimeui);

:slight_smile:


Ionic page not displaying image even with absolute path
#2

I did all of them but when I try to ionic serve, it gives me this error on terminal:

Error: Cannot find module ‘@angular/core’ from ‘C:\Users\can\mobile\ionic
r\node_modules\primeng\components\tree’

it gives that error for each component.


#3

I think actually ionic 2 framework and primeng framework not using the same version of angular2 , I could try with beta ionic 2 using angular rc1


#4

@vevedh is right --> ionic 2 beta 6 uses angular beta 15. the new namespacing ‘@angular/…’ was introduces in the RC’s


#5

Thanks for the information. Should we update the angular2 version or wait for it to become comfortable with Ionic side?


#6

You’re going to have to wait for Ionic to support it. It’s completely impossible to mix code that is importing from @angular with code that is importing from angular2.