Question

我用typescript做了一个小测试angular2应用程序。我没有任何错误，但我生成的js文件没有加载。这是我的代码;

在default.aspx页面中我有我的选择器：

 <asp:Content ContentPlaceHolderID="PlaceHolderMain" runat="server">
 <app-main>Loading...</app-main>
 </asp:Content>

boot.ts

import {bootstrap} from 'angular2/platform/browser'
import {AppComponent} from './app.component'
bootstrap(AppComponent)

app.component.ts

import {Welcome} from './app.module'
import {Component} from 'angular2/core'
@Component({
selector: 'app-main',
template: `<h1>${Welcome.GetWelcome()}</h1>`
}) export class AppComponent { }

app.module.ts

export class Welcome {
static GetWelcome(): string {
    return "Hello World";
}
}

tsconfig.json

{
"compileOnSave": true,
"compilerOptions": {
"watch":  true,
"noImplicitAny": false,
"noEmitOnError": true,
"removeComments": false,
"sourceMap": true,
"target": "ES5",
"module": "system",
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true
 },
 "exclude": [
 "./node_modules",
 "./typings/main",
 "./typings/main.d.ts"
 ]
 }

代码正在编译，但欢迎消息未在app-main中加载。我在这做错了什么？我正在使用Visual Studio 2015，版本14.0

Answer 1

我为你做了一个傻瓜http://plnkr.co/edit/oMOvCgFzqtnYYPcE2U6j?p=preview

由于@toskv建议绑定字符串不起作用。您将字符串定义为组件中的字段。并在模板中使用双{{msg}}个标记。这是简短版本：

@Component({
selector: 'app-main',
template: `<h1>{{msg}}</h1>`
}) 
export class AppComponent {
  msg = Welcome.GetWelcome();      
}

Typescript似乎不起作用，代码中没有错误但组件不显示

1 个答案: