访问路由器参数的角度2错误

时间:2016-08-26 18:27:41

标签: javascript angular angular2-routing

我在访问以下路由器参数时收到打字稿错误:

" app.component.ts属性'imageUrl'在类型'{[name:string]:any}"

上不存在

我能够使该属性正常,但该错误导致我的服务器在启动时失败。这是我用来访问imageUrl param的代码:

this.router.events
      .filter(event => event instanceof NavigationEnd)
      .subscribe(_ => {
          let childRouteSnapshot = this.route.firstChild.snapshot;
          let url = childRouteSnapshot.data.imageUrl;

我的路由器参数定义为:

data: {
        imageUrl: '/app/assets/images/image.png',

就像我说的,代码有效,但我不确定打字稿错误是否与我的语法或过时的打字稿引用有关。

这是我的package.json:

{
  "name": "angular2-quickstart",
  "version": "1.0.0",
  "description": "QuickStart package.json from the documentation, supplemented with testing support",
  "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",
    "pree2e": "npm run webdriver:update",
    "e2e": "tsc && concurrently \"http-server -s\" \"protractor protractor.config.js\" --kill-others --success first",
    "lint": "tslint ./app/**/*.ts -t verbose",
    "lite": "lite-server",
    "postinstall": "typings install",
    "test": "tsc && concurrently \"tsc -w\" \"karma start karma.conf.js\"",
    "test-once": "tsc && karma start karma.conf.js --single-run",
    "tsc": "tsc",
    "tsc:w": "tsc -w",
    "typings": "typings",
    "webdriver:update": "webdriver-manager update"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "@angular/common":  "2.0.0-rc.5",
    "@angular/compiler":  "2.0.0-rc.5",
    "@angular/core":  "2.0.0-rc.5",
    "@angular/forms": "0.3.0",
    "@angular/http":  "2.0.0-rc.5",
    "@angular/platform-browser":  "2.0.0-rc.5",
    "@angular/platform-browser-dynamic":  "2.0.0-rc.5",
    "@angular/router":  "3.0.0-rc.1",
    "@angular/router-deprecated":  "2.0.0-rc.2",
    "@angular/upgrade":  "2.0.0-rc.5",

    "systemjs": "0.19.27",
    "core-js": "^2.4.0",
    "reflect-metadata": "^0.1.3",
    "rxjs": "5.0.0-beta.6",
    "zone.js": "^0.6.12",

    "angular2-in-memory-web-api": "0.0.15",
    "bootstrap": "^3.3.6"
  },
  "devDependencies": {
    "concurrently": "^2.2.0",
    "lite-server": "^2.2.0",
    "typescript": "^1.8.10",
    "typings": "^1.0.4",

    "canonical-path": "0.0.2",
    "http-server": "^0.9.0",
    "tslint": "^3.7.4",
    "lodash": "^4.11.1",
    "jasmine-core": "~2.4.1",
    "karma": "^0.13.22",
    "karma-chrome-launcher": "^0.2.3",
    "karma-cli": "^0.1.2",
    "karma-htmlfile-reporter": "^0.2.2",
    "karma-jasmine": "^0.3.8",
    "protractor": "^3.3.0",
    "rimraf": "^2.5.2"
  },
  "repository": {}
}

我应该使用谷歌快速启动设置以外的东西吗?感谢。

1 个答案:

答案 0 :(得分:0)

TypeScript在编译时不知道data上的哪些属性。

您应该使用括号表示法。

let url = childRouteSnapshot.data["imageUrl"];