Угловые 2 ошибки доступа к маршрутизатору PARAMS

Question

Я получаю сообщение об ошибке при доступе к машинопись маршрутизатора Params, который читает:

«app.component.ts Свойство„ImageUrl“не существует на типа«{[название: строка]: any} "

Я могу получить свойство в порядке, но ошибка приводит к сбою моего сервера при запуске. Вот код, я использую, чтобы получить доступ к ImageUrl параметров:

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": {} 
} 

Должен ли я использовать что-то другое, чем быстрой настройки запуска от Google? Благодарю.

Answer 1

TypeScript не знает, какие свойства будут на data во время компиляции.

Вместо этого следует использовать нотацию с кронштейном.

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