1. #1
    Futur Membre du Club
    Homme Profil pro
    Étudiant
    Inscrit en
    avril 2015
    Messages
    7
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Algérie

    Informations professionnelles :
    Activité : Étudiant
    Secteur : Enseignement

    Informations forums :
    Inscription : avril 2015
    Messages : 7
    Points : 5
    Points
    5

    Par défaut Angular 2 : Cannot read property 'dataAdapter' of undefined

    Bonjour,

    Lorsque j'essaie d'intégrer angular_jqxscheduler, je reçois l'erreur : “Cannot read property ‘dataAdapter’ of undefined”.

    Voici mes fichiers :
    //—————————————————————–
    scheduler.component.ts
    //—————————————————————–
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
     
    /// <reference path=”../used/jqwidgets.d.ts” />
    import { Component, ViewChild, AfterViewInit } from@angular/core’;
    import { jqxSchedulerComponent } from ‘../used/angular_jqxscheduler’;
    @Component({
    	selector: ‘scheduler-app’,
    	template: <jqxScheduler #schedulerReference></jqxScheduler>
    })
    export class SchedulerComponent implements AfterViewInit
    {
    	@ViewChild(‘schedulerReference’) scheduler: jqxSchedulerComponent;
    	ngAfterViewInit(): void
    	{
    		this.scheduler.createComponent(this.schedulerSettings);
    		this.scheduler.ensureAppointmentVisible(‘id1’);
    	}
    	generateAppointments(): any
    	{
    		let appointments = new Array();
    		let appointment1 = {
    			id: “id1”,
    			description: “George brings projector for presentations.”,
    			location: “”,
    			subject: “Quarterly Project Review Meeting”,
    			calendar: “Room 1,
    			start: new Date(2016, 10, 23, 9, 0, 0),
    			end: new Date(2016, 10, 23, 16, 0, 0)
    		};
    		appointments.push(appointment1);
    		return appointments;
    	}
    	source =
    	{
    		dataType: “array”,
    		dataFields: [
    		{ name: ‘id’, type:string},
    		{ name: ‘description’, type:string},
    		{ name: ‘location’, type:string},
    		{ name: ‘subject’, type:string},
    		{ name: ‘calendar’, type:string},
    		{ name: ‘start’, type: ‘date’ },
    		{ name: ‘end’, type: ‘date’ }
    		],
    		id: ‘id’,
    		localData: this.generateAppointments()
    	}
    	dataAdapter = new $.jqx.dataAdapter(this.source);
    	schedulerSettings: jqwidgets.SchedulerOptions =
    	{
    		date: new $.jqx.date(2016, 11, 23),
    		width: 800,
    		height: 600,
    		source: this.dataAdapter,
    		view: ‘weekView’,
    		showLegend: true,
    		appointmentDataFields:
    		{
    			from: “start”,
    			to: “end”,
    			id: “id”,
    			description: “description”,
    			location: “location”,
    			subject: “subject”,
    			resourceId: “calendar”,
    		},
    		resources:
    		{
    			colorScheme: “scheme05”,
    			dataField: “calendar”,
    			source: new $.jqx.dataAdapter(this.source)
    		},
    		views:
    		[
    		‘dayView’,
    		‘weekView’,
    		‘monthView’
    		]
    	};
    }
    //—————————————————————–
    components-routing.module.ts
    //—————————————————————–
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
     
    import { NgModule } from@angular/core’;
    import { Routes, RouterModule } from@angular/router’;
    import { SchedulerComponent } from ‘./scheduler.component;
    const routes: Routes = [
    {
    	path:,
    	data: {
    		title: ‘Components’
    	},
    	children: [
    	{
    		path: ‘scheduler’,
    		component: SchedulerComponent,
    			data: {
    			title: ‘Scheduler’
    		}
    	},
    	]
    }
    ];
    @NgModule({
    	imports: [RouterModule.forChild(routes)],
    	exports: [RouterModule]
    })
    export class ComponentsRoutingModule {}
    //————————————————
    components.module.ts
    //————————————————
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
     
    import { NgModule } from@angular/core’;
    import { ComponentsRoutingModule } from ‘./components-routing.module;
    import { ModalModule } from ‘ng2-bootstrap/modal’;
    import { SchedulerComponent } from ‘./scheduler.component;
    import { jqxSchedulerComponent } from “../used/angular_jqxscheduler”;
    @NgModule({
    imports: [
    	ComponentsRoutingModule,
    	ModalModule.forRoot(),
    	TabsModule,
    	],
    	declarations: [
    	SchedulerComponent,
    	jqxSchedulerComponent
    	]
    })
    export class ComponentsModule { }
    //———————————————–
    app.component.ts
    //———————————————–
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
     
    import { Component } from@angular/core’;
    @Component({
    	selector: ‘body’,
    	template:<router-outlet></router-outlet>})
    export class AppComponent { }
    //———————————————–
    app.module.ts
    //———————————————–
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
     
    import { NgModule } from@angular/core’;
    import { BrowserModule } from@angular/platform-browser’;
    import { LocationStrategy, HashLocationStrategy } from@angular/common’;
    import { AppComponent } from ‘./app.component;
    import { AppRoutingModule } from ‘./app.routing;
    @NgModule({
    	imports: [
    		BrowserModule,
    		AppRoutingModule,
    		DropdownModule.forRoot(),
    		TabsModule.forRoot(),
    	],
    	declarations: [
    		AppComponent,
    	],
    	providers: [{
    		provide: LocationStrategy,
    		useClass: HashLocationStrategy
    	}],
    bootstrap: [ AppComponent ]
    })
    export class AppModule { }
    //————————————————-
    app.routing.ts
    //————————————————-
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
     
    import { NgModule } from@angular/core’;
    import { Routes, RouterModule } from@angular/router’;
    import { FullLayoutComponent } from ‘./layouts/full-layout.component;
    export const routes: Routes = [
    {
    	path:,
    	redirectTo: ‘home’,
    	pathMatch: ‘full’,
    },
    {
    	path:,
    	component: FullLayoutComponent,
    	data: {
    	title: ‘Accueil’
    	},
    	children: [
    	{
    	path: ‘components’,
    	loadChildren: ‘./components/components.module#ComponentsModule’
    	}
    	]
    }
    ];
    @NgModule({
    	imports: [ RouterModule.forRoot(routes) ],
    	exports: [ RouterModule ]
    })
    export class AppRoutingModule {}
    //——————————————————-
    index.ts
    //——————————————————-
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
     
    export * from ‘./app.component;
    export * from ‘./app.module;
    //——————————————————-
    main.ts
    //——————————————————-
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
     
    import { platformBrowserDynamic } from@angular/platform-browser-dynamic’;
    import { AppModule } from ‘./app.module;
    const platform = platformBrowserDynamic();
    platform.bootstrapModule(AppModule);
    //——————————————————–
    index.html
    //——————————————————–
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
     
    <!doctype html>
    	<html>
    		<head>
    			<base href=”./>
    				<meta charset=”utf-8&#8243;>
    		</head>
    		<body>
    		<script>
    			window.__theme = ‘bs4’;
    		</script>
    		<!– App Loading… –>
    		</body>
    	</html>
    //———————————————-
    main.ts
    //———————————————–
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
     
    import ‘./polyfills.ts;
    import { platformBrowserDynamic } from@angular/platform-browser-dynamic’;
    import { enableProdMode } from@angular/core’;
    import { environment } from ‘./environments/environment’;
    import { AppModule } from ‘./app/;
    if (environment.production) {
    	enableProdMode();
    }
    platformBrowserDynamic().bootstrapModule(AppModule);

  2. #2
    Membre à l'essai
    Homme Profil pro
    Développeur Web
    Inscrit en
    mars 2017
    Messages
    7
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 24
    Localisation : France, Essonne (Île de France)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : mars 2017
    Messages : 7
    Points : 12
    Points
    12

    Par défaut

    Où as tu importé les 2 modules : DropdownModule, TabsModule ?

Discussions similaires

  1. Réponses: 3
    Dernier message: 01/06/2016, 20h45
  2. Erreur : TypeError: Cannot read property 'test' of undefined
    Par deathness dans le forum AngularJS
    Réponses: 1
    Dernier message: 11/05/2016, 10h42
  3. Réponses: 3
    Dernier message: 30/05/2015, 12h08
  4. [V8] Importation csv Error Cannot read property '1' of undefined
    Par vernetk dans le forum Odoo (ex-OpenERP)
    Réponses: 1
    Dernier message: 11/02/2015, 16h36
  5. Réponses: 15
    Dernier message: 15/06/2013, 01h11

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo