AngularJs 1.x 升级，意外令牌：用于安全类型答案

【问题标题】：AngularJs 1.x upgrade, unexpected token : for a safe typeAngularJs 1.x 升级，意外令牌：用于安全类型
【发布时间】：2016-06-07 18:19:17
【问题描述】：

我正在研究 angularjs 从 1 到 2 的升级教程 (Angular 1 upgrade) 和 phonecat 代码库示例。在安装 typescript 和所有提到的依赖项后，为函数参数输入添加类型 :boolean 会使 chrome 执行失败，并出现“Uncaught SyntaxError: Unexpected token :” checkmarkFilterProvider 连续未创建，并且 Provider 注入失败零件。

(function() {
    ///<reference path='../../../typings/index.d.ts' />
    'use strict';

    angular.
        module('core').
        filter('checkmark', function() {
            return function(input:boolean) {
                return input ? '\u2713' : '\u2718';
            };
        });
})();

npm run tsc -w 命令编译 .ts 文件并创建地图，但是，浏览器执行失败。

package.json

{
    "name": "angular-phonecat",
    "private": true,
    "version": "0.0.0",
    "description": "A tutorial application for AngularJS",
    "repository": "https://github.com/angular/angular-phonecat",
    "license": "MIT",
    "dependencies": {},
    "devDependencies": {
        "bower": "^1.7.7",
        "concurrently": "^2.1.0",
        "http-server": "^0.9.0",
        "jasmine-core": "^2.4.1",
        "karma": "^0.13.22",
        "karma-chrome-launcher": "^0.2.3",
        "karma-firefox-launcher": "^0.1.7",
        "karma-jasmine": "^0.3.8",
        "protractor": "^3.2.2",
        "shelljs": "^0.6.0",
        "tsc": "^1.20150623.0",
        "typescript": "^1.8.10",
        "typings": "^1.0.4"
    },
    "scripts": {
        "postinstall": "bower install",
        "prestart": "npm install",
        "start": "tsc && concurrently \"npm run tsc:w\" \"npm run http\" ",
        "tsc": "tsc",
        "tsc:w": "tsc -w",
        "typings": "typings",
        "http": "http-server -a localhost -p 8000 -c-1 ./app",
        "pretest": "npm install",
        "test": "karma start karma.conf.js",
        "test-single-run": "karma start karma.conf.js --single-run",
        "preupdate-webdriver": "npm install",
        "update-webdriver": "webdriver-manager update",
        "preprotractor": "npm run update-webdriver",
        "protractor": "protractor e2e-tests/protractor.conf.js",
    }
}

tsconfig.json

{
  "compilerOptions": {
      "target": "es5",
      "module": "commonjs",
      "moduleResolution": "node",
      "sourceMap": true,
      "emitDecoratorMetadata": true,
      "experimentalDecorators": true,
      "removeComments": false,
      "noImplicitAny": false,
      "suppressImplicitAnyIndexErrors": true
  },
  "exclude": [
    "node_modules"
  ]
}

最后 *.ts 源文件在项目浏览器中编译，但浏览器没有它们，正如@tadwork 指出的那样。我的配置遗漏了什么？

更新

为了运行 Angular 应用程序，我从 package.json 执行 npm start 脚本，理论上应该编译 *.ts 文件并以 ./app 作为服务器源运行 http-server（请参阅 package.json 脚本 -> 启动）。

./app 脚本执行后的文件夹已编译 *.js 和 *.map.js 文件。

【问题讨论】：

标签： angularjs typescript angular2-upgrade

【解决方案1】：

看起来 Typescript 类型注释在没有被编译的情况下被注入浏览器，所以类型仍然在 input 参数上

return function(input: 布尔值 )

【讨论】：

你是对的。有什么建议可以解决这个问题吗？
这可能是因为 *.ts 文件正在被提供，你能详细说明你是如何提供文件的吗？
我启动 http-server 并将其定位到 ./app 文件夹。文件夹已编译 *.js 文件。问题中有一个更新的部分。
如果您查看该文件夹中已编译的 .js 文件，它是否具有布尔类型？（不是来自浏览器？）
您的问题让我找到了答案。在将 ng1 升级到 ng2 期间，我已将 *.js 文件重命名为 *.ts 文件，IDE 也重命名了引用，以及 index.html 中文件的引用。回滚 index.html 后一切正常。