0

here is the image of the code and i don't know how to use it in angular 10hello there i'm new to angular, i want angular-gantt angular-gantt in my angular 10 project can somebody explain me step by step procedure for doing this... event i tried adding js and css in angular.json file.

"styles": [
          "node_modules/angular2-multiselect-dropdown/themes/default.theme.css",
          "node_modules/@coreui/icons/css/coreui-icons.css",
          "node_modules/flag-icon-css/css/flag-icon.css",
          "node_modules/font-awesome/css/font-awesome.css",
          "node_modules/simple-line-icons/css/simple-line-icons.css",
          "node_modules/intl-tel-input/build/css/intlTelInput.css",
          "src/scss/style.scss",
          "node_modules/summernote/dist/summernote-lite.min.css",
          "node_modules/angular-gantt/dist/angular-gantt.min.css"

        ],
        "scripts": [
          "node_modules/chart.js/dist/Chart.min.js",
          "node_modules/intl-tel-input/build/js/intlTelInput.min.js",
          "node_modules/summernote/dist/summernote-lite.min.js",
          "node_modules/angular-gantt/dist/angular-gantt.min.js"
        ]
R. Richards
  • 24,603
  • 10
  • 64
  • 64
Mohit Kumar
  • 1
  • 1

1 Answers1

0

Try this steps below,

  1. Import the GanttModule in app.module.ts file from the ej2-angular-gantt package. import { GanttModule } from 'your downloaded location';

  2. Import and inject GanttModule within providers section of app.module.ts. @NgModule({ declarations: [ .. ], imports: [ .. GanttModule, .. ], })

  3. Refer the CSS file for Angular Gantt in styles.css

  4. Example : Configure data and taskfield in your ts and bind it in html as follows,

    <ejs-gantt id="GanttSample" [dataSource]="data" height= "500px" width="800px" [taskFields]= "taskfield">

RGA
  • 303
  • 3
  • 11
  • actually i want too use angular-gantt which is a angularjs lib not this... coz this is a paid lib – Mohit Kumar Mar 26 '21 at 09:32
  • You can install using npm or yarn which is free. All other steps are same. Command is npm add angular-gantt --save – RGA Mar 26 '21 at 11:40
  • You can check this link https://stackblitz.com/edit/angular-ng-gantt – RGA Mar 26 '21 at 11:57
  • i want to use this... https://www.angular-gantt.com/get-started/ and the when i installed it using "npm install angular-gantt --save" it isntalled in node modules but when i tried to import the module in app.module.ts with "import { GanttModule } from 'angular-gantt' " it is saying Failed to compile. ./node_modules/angular-gantt/dist/angular-gantt.js Module not found: Error: Can't resolve 'ElementQueries' in '/home/mohit/Desktop/athmin projects/pronnelfrontend/node_modules/angular-gantt/dist' – Mohit Kumar Mar 31 '21 at 07:08