Error on importing ng2-dropdown-treeview in module
Closed this issue · 6 comments
Hi there,
Thanx for the plugin it looks very promosing. I have implemented the plugin the same way you have with your demo but I get a initial error on loading of my webapp.
expected expression, got '<'
Which this is the line where I am importing the ng2-dropdown-treeview into my module.
Is there a specific version of angular2 you are using this with?
I am using it in my demo & in my project. It works well with no problem. You should give more information so that I can help you. Thanks.
Thanx for the prompt response. I have pretty much followed this plunker https://embed.plnkr.co/1kcbUvNze8HAJ0tN0wsX/
My systemjs.config.js file:
(function (global) {
System.config({
paths: {
// paths serve as alias
'npm:': '/libs/'
},
// map tells the System loader where to look for things
map: {
// our app is within the app folder
app: '/Scripts',
// angular bundles
'@angular/core': 'npm:@angular/core/bundles/core.umd.js',
'@angular/common': 'npm:@angular/common/bundles/common.umd.js',
'@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
'@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
'@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
'@angular/http': 'npm:@angular/http/bundles/http.umd.js',
'@angular/router': 'npm:@angular/router/bundles/router.umd.js',
'@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',
// other libraries
'rxjs': 'npm:rxjs',
'angular2-in-memory-web-api': 'npm:angular2-in-memory-web-api',
'ng2-toasty': 'npm:ng2-toasty',
'lodash': 'npm:lodash/lodash.min.js',
'ng2-dropdown-treeview': 'npm:ng2-dropdown-treeview',
},
// packages tells the System loader how to load when no filename and/or no extension
packages: {
app: {
main: './main.js',
defaultExtension: 'js'
},
rxjs: {
defaultExtension: 'js'
},
'ng2-toasty': {
main: './index.js',
defaultExtension: 'js'
},
'angular2-in-memory-web-api': {
main: './index.js',
defaultExtension: 'js'
}
}
});
})(this);
My app.module.ts:
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { BrowserModule } from '@angular/platform-browser';
import { HttpModule } from '@angular/http';
import { Routing } from './app.routing';
import { DropdownTreeviewModule } from 'ng2-dropdown-treeview';
import { I18n } from './_models/i18n';
import { DisabledOnSelectorDirective } from './_directives/disabled-on-selector.directive';
@NgModule({
bootstrap: [ AppComponent ],
declarations: [
AppComponent,
],
imports: [
DropdownTreeviewModule.forRoot(),
BrowserModule,
HttpModule,
FormsModule,
ReactiveFormsModule,
Routing
],
providers: [
I18n
]
})
export class AppModule {
}
This error occurs on the line where DropdownTreeviewModule gets imported
When inspecting the error I get message
"expected expression, got '<'"
Stack message
"bootstrap/</</__exec@http://localhost:52767/libs/systemjs/dist/system.src.js:1510:10bootstrap/</</</entry.execute@http://localhost:52767/libs/systemjs/dist/system.src.js:3652:9linkDynamicModule@http://localhost:52767/libs/systemjs/dist/system.src.js:3252:18getModule@http://localhost:52767/libs/systemjs/dist/system.src.js:3220:9linkDynamicModule/output<@http://localhost:52767/libs/systemjs/dist/system.src.js:3256:16require@http://localhost:52767/libs/systemjs/dist/system.src.js:3893:20@http://localhost:52767/Scripts/app.module.js:22:31@http://localhost:52767/Scripts/app.module.js:1:31@http://localhost:52767/Scripts/app.module.js:1:2bootstrap/</</__exec@http://localhost:52767/libs/systemjs/dist/system.src.js:1510:10bootstrap/</</</</entry.execute@http://localhost:52767/libs/systemjs/dist/system.src.js:3926:11linkDynamicModule@http://localhost:52767/libs/systemjs/dist/system.src.js:3252:18getModule@http://localhost:52767/libs/systemjs/dist/system.src.js:3220:9linkDynamicModule/output<@http://localhost:52767/libs/systemjs/dist/system.src.js:3256:16require@http://localhost:52767/libs/systemjs/dist/system.src.js:3893:20@http://localhost:52767/Scripts/main.js:3:20@http://localhost:52767/Scripts/main.js:1:31@http://localhost:52767/Scripts/main.js:1:2bootstrap/</</__exec@http://localhost:52767/libs/systemjs/dist/system.src.js:1510:10bootstrap/</</</</entry.execute@http://localhost:52767/libs/systemjs/dist/system.src.js:3926:11linkDynamicModule@http://localhost:52767/libs/systemjs/dist/system.src.js:3252:18link@http://localhost:52767/libs/systemjs/dist/system.src.js:3095:11bootstrap/</</</</</<.execute@http://localhost:52767/libs/systemjs/dist/system.src.js:3432:13doDynamicExecute@http://localhost:52767/libs/systemjs/dist/system.src.js:798:20link@http://localhost:52767/libs/systemjs/dist/system.src.js:1000:20doLink@http://localhost:52767/libs/systemjs/dist/system.src.js:652:7updateLinkSetOnLoad@http://localhost:52767/libs/systemjs/dist/system.src.js:700:18proceedToTranslate/</<@http://localhost:52767/libs/systemjs/dist/system.src.js:512:11ZoneDelegate.prototype.invoke@http://localhost:52767/libs/zone.js/dist/zone.js:232:17Zone.prototype.run@http://localhost:52767/libs/zone.js/dist/zone.js:114:24scheduleResolveOrReject/<@http://localhost:52767/libs/zone.js/dist/zone.js:502:52ZoneDelegate.prototype.invokeTask@http://localhost:52767/libs/zone.js/dist/zone.js:265:21Zone.prototype.runTask@http://localhost:52767/libs/zone.js/dist/zone.js:154:28drainMicroTaskQueue@http://localhost:52767/libs/zone.js/dist/zone.js:401:25ZoneTask/this.invoke@http://localhost:52767/libs/zone.js/dist/zone.js:339:25"
Side note: I'm not using Webpack
Thanx for your help
You are using any Angular seed? Angular CLI or Webpack or systemJS or orthers? Your information is also not easy to find root cause.
I'm using systemJS
I also am using SystemJS in my demo: https://embed.plnkr.co/1kcbUvNze8HAJ0tN0wsX/
You can download & play it (follow this guide to run in local server: https://basementmedia.no/2015/06/26/previewing-website-when-editing-in-visual-studio-code/)
My demo runs well with SystemJS :)
@leovo2708 hello leovo, do you know how to add data automatically? not just fix data. I will get test cases name on robot test cases from GIT ,and i will show those test cases with tree view.