打字稿中的@bindable不起作用

Question

我正在使用带有TypeScript的aurelia（v 1.5.4）。我正在使用https://github.com/aurelia/<>/blob/master/dist/amd/aurelia-<>.d.ts中的类型定义。此外，我使用VS 2015进行开发，使用以下TypeScript Build配置：。

但是，当我在我的虚拟机和视图中使用@bindable时，似乎无法正常工作。下面是我尝试在导航栏中使用的示例：

nav-bar.ts：

import aur = require("aurelia-framework");
import bindable = aur.bindable;

export class NavBar {
      @bindable router = null;
      ....
}

这就是我在app.html中使用它的方式：

<template>
<import from='./nav-bar'></import>

<nav-bar router.bind="router"></nav-bar>


<div class="page-host row">
    <router-view></router-view>
</div>
</template>

但由于某种原因，它不起作用。如果我需要采取不同的行动，请告诉我。

谢谢。

Answer 1

我最近切换到TypeScript但我不需要更改我的@bindable，我确实添加了一个类型以保持编译器满意......

import { bindable} from 'aurelia-framework';

export class SomeClass{
  @bindable property: boolean = false;
  ...
}

虽然使用我的NavBar我确实遇到了问题，因为我既绑定了路由器又注入了它，在这种情况下我使用了注入路由器的别名。

Answer 2

确保已设置TypeScript编译器选项以启用experimentalDecorators。如果您使用的是Visual Studio，则可以在。* proj文件中完成;如果使用的是Gulp /命令行，则可以在tsconfig.json中完成。

<强> tsconfig.json

{
  "version": "1.5.0",
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "declaration": false,
    "noImplicitAny": false,
    "removeComments": true,
    "noLib": false,
    "emitDecoratorMetadata": true,
    "sourceMap": true,
    "listFiles": true,
    "outDir": "dist",
    "experimentalDecorators": true
  }
}

即可。*凸出

<PropertyGroup>
    <TypeScriptTarget>ES5</TypeScriptTarget>
    <TypeScriptRemoveComments>false</TypeScriptRemoveComments>
    <TypeScriptSourceMap>true</TypeScriptSourceMap>
    <TypeScriptModuleKind>AMD</TypeScriptModuleKind>
    <DefineConstants>TRACE;DEBUG</DefineConstants>
    <TypeScriptCompileOnSaveEnabled>True</TypeScriptCompileOnSaveEnabled>
    <TypeScriptNoImplicitAny>False</TypeScriptNoImplicitAny>
    <TypeScriptExperimentalDecorators>true</TypeScriptExperimentalDecorators
</PropertyGroup>

有关详细信息，请参阅此问题：

Visual Studio 2015 RC Typescript experimental decorators error