TS文件未被调用

Question

我正在尝试使用角2将选择器插入到我的html中。

我与appmodule.ts一起创建了html和ts文件，如下所示。

我的html页面似乎没有在加载时调用ts文件(weather.component.ts)。它没有显示在类型记录文件中定义的模板。我尝试过在html头标签中使用system.import，但是没有运气。

感谢你的投入。

<div>
    <h3>Weather for {{weather.city}}</h3>

</div>

weather.component.ts文件

import { Component } from '@angular/core';

@Component({
selector: 'weather',
template: '<h1>u are here </h1>'

})

export class WeatherComponent {
public weather: Weather;

constructor() {
this.weather = { temp: "12", summary: "Barmy", city: "London" };
}
}

interface Weather {
temp: string;
summary: string;
city: string;
}

app.module.ts

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { RouterModule } from '@angular/router';
import {ROUTER_PROVIDERS} from 'angular2/router';
import { UniversalModule } from 'angular-universal';
import { WeatherComponent } from './components/weather.component';

@NgModule({
bootstrap: [WeatherComponent],
declarations: [WeatherComponent],
imports: [UniversalModule],
})

export class AppModule {
}

platformBrowserDynamic().bootstrapModule(AppModule);

Answer 1

因为它不是那样工作的。

当您给组件一个选择器(这里是weather)时，您应该在html中使用它作为标记。

这将为HTML提供：

<div>
    <h1>You are here</h1>
    <weather></weather>
</div>

在模板HTML中：

<h3>Weather for {{weather.city}}</h3>