app.component.ts 和 app.component 有什么区别.html

Question

我不明白app.component.ts和app.component.html在angular 2中的区别。

我能够同时使用两者创建页面。然后在开发网页时使用什么。

请指导我，我是 angularjs2 的新手。 谢谢！

Answer 1

app.component.ts - 此文件是任何组件的主类文件 app.component.html - 此文件是组件的 html，可以与应用程序组件绑定

app.component.ts 有一个@component装饰器，您还可以在其中将 HTML 部件定义为模板

如果你想给任何html文件外部链接，那么你将使用templateUrl并将html文件传递到其中

Answer 2

app.component.ts 和 app.component.html 之间的区别在于呈现的 HTML 内容来自 app.component.html而为数据操作编写的逻辑是在 app.component.ts 中完成的。

所有函数都写在 .ts 文件中，html 元素.html文件中。

但是，您可能不需要一直使用 HTML 文件，在某些情况下，要呈现的 HTML 可能非常少且静态，如下所示

<p>Welcome to my page</p>

如果是这种情况，您不需要单独的.html文件，您可以使用

@Component({
selector: 'app-selector',
template: '<p>Welcome to my page</p>',   
styleUrls: ['./custom.component.scss']
)}

拥有一个单独的文件来编写函数逻辑和渲染 html 元素将有助于调试和许多类似的事情。它将提高易读性。