尝试使用网格组件时出现angular 2 kendo-angular-intl 404错误

时间:2016-09-22 21:09:28

标签: angular kendo-grid kendo-ui-angular2

我按照Telerik网格概述页面(http://www.telerik.com/kendo-angular-ui/components/grid/)上的入门示例进行操作,并按照说明操作,但不断收到此错误:

获取http://localhost:3000/@progress/kendo-angular-intl 404(未找到)

我有一个按钮可以工作,没有问题,点击事件有效,而且蒙皮工作就像在他们的例子中一样,但是我按照网格示例跟着字母,网格给出了这个错误。

我试过拉进@ progress / kendo-angular-intl并将其添加到我的system.config.js中,就像我添加按钮一样,但没有运气。我也尝试拉入图表并得到与上述相同的问题。

我正在使用Angular 2.0.0版本,这是我的package.json:

{
  "name": "myApp",
   "version": "1.0.0",
   "description": "myApp",
   "scripts": {
     "start": "tsc && concurrently \"tsc -w\" \"lite-server\" ",
     "docker-build": "docker build -t ng2-quickstart .",
     "docker": "npm run docker-build && docker run -it --rm -p 3000:3000 -p      3001:3001 ng2-quickstart",
     "e2e": "tsc && concurrently \"http-server\" \"protractor      protractor.config.js\"",
     "lint": "tslint ./app/**/*.ts -t verbose",
     "lite": "lite-server",
     "postinstall": "typings install",
     "test": "tsc && concurrently \"tsc -w\" \"karma start karma.conf.js\"",
     "tsc": "tsc",
     "tsc:w": "tsc -w",
     "typings": "typings",
     "webdriver:update": "webdriver-manager update"
   },
   "keywords": [],
   "author": "",
   "license": "ISC",
   "dependencies": {
     "@angular/common": "2.0.0",
     "@angular/compiler": "2.0.0",
     "@angular/core": "2.0.0",
     "@angular/forms": "2.0.0",
     "@angular/http": "2.0.0",
     "@angular/platform-browser": "2.0.0",
     "@angular/platform-browser-dynamic": "2.0.0",
     "@angular/router": "3.0.0",
     "@angular/upgrade": "2.0.0",
     "@progress/kendo-angular-buttons": "^0.9.3",
     "@progress/kendo-angular-charts": "^0.5.1",
     "@progress/kendo-angular-grid": "^0.3.2",
     "@progress/kendo-angular-intl": "^0.4.1",
     "angular2-localstorage": "^0.4.0",
     "bootstrap": "^3.3.6",
     "chart.js": "^2.1.3",
     "es6-shim": "^0.35.0",
     "font-awesome": "^4.6.3",
     "primeng": "^1.0.0-beta.16",
     "primeui": "^4.1.15",
     "reflect-metadata": "^0.1.3",
     "roboto-font": "^0.1.0",
     "rxjs": "5.0.0-beta.12",
     "systemjs": "0.19.37",
     "zone.js": "^0.6.17"
   },
   "devDependencies": {
     "concurrently": "^2.2.0",
     "lite-server": "^2.2.0",
     "typescript": "^1.8.10",
     "typings": "^1.0.4"
   },
   "repository": {}
 }

3 个答案:

答案 0 :(得分:2)

以下是我的设置,网格现在正在为我工​​作。

我最初遇到了同样的问题。

我为intl包运行了这个脚本。 npm install --save cldr-data

使用这些设置一切正常。

ScreenShot: System Config

ScreenShot: node_modules folder for @progress and @telerik

希望这会有所帮助。

答案 1 :(得分:2)

我在玩网格时遇到了同样的错误。 您必须在## systemjs.config.js ##,

中添加一些配置
 map: {
  // our app is within the app folder
  app: 'app',

  '@progress/kendo-angular-grid': 'npm:@progress/kendo-angular-grid',
  '@progress/kendo-angular-intl': 'npm:@progress/kendo-angular-intl',
  '@telerik/kendo-intl': 'npm:@telerik/kendo-intl',
},
 // packages tells the System loader how to load when no filename and/or no extension
packages: {
  app: {
    main: './main.js',
    defaultExtension: 'js'
  },
  'npm:@progress/kendo-angular-grid': {
    main: './dist/npm/js/main.js',
    defaultExtension: 'js'
  },
  'npm:@progress/kendo-angular-intl': {
    main: './dist/npm/js/main.js',
    defaultExtension: 'js'
  },
  'npm:@telerik/kendo-intl': {
    main: './dist/npm/js/main.js',
    defaultExtension: 'js'
  }
}

希望可以帮助您解决问题。

答案 2 :(得分:0)

我做到了:

在我的项目根目录中安装了@ telerik / kendo-intl。在我的system.config.js文件中,我添加了:

map: {
...........\\\\
'@telerik/kendo-intl': 'npm:@telerik/kendo-intl',
...........\\\\
},
packages: {
...........\\\\
'npm:@telerik/kendo-intl': {
 main: './dist/npm/js/main.js',
 defaultExtension: 'js'
 },
............\\\\
}

现在Kendo Grid可见,但我的网页没有Kendo样式。

编辑:我在添加样式后再次运行我的代码,Kendo Button现在看起来像Kendo Button但Kendo Grid仍然看起来不像Kendo Grid。