Question

对于我在Angular 2中遇到的每个例子，模板都存在于组件装饰器中。

import { Component } from '@angular/core';
@Component({
  selector: 'my-app',
  template: '<h1>Hello world</h1>'
})
export class AppComponent { }

这是正确的惯例吗？当模板变得复杂时，我会想象这种语法变得很麻烦。

我尝试使用 templateUrl 代替模板。但据我所知，Angular将通过ajax加载模板。（稍微相关，但是因为我已经更新到2.0.0-rc.3 templateUrl似乎不再起作用，但也许我做错了什么。）

处理模板的最佳方法是什么？

Answer 1

你可以在rc3中使用templateUrl;请参阅下面的基本组件的模板代码：

import pandas as pd
import numpy as np
groups = df.groupby('CASE').agg(lambda g: [g.TYPE.unique()]).
            apply(lambda row: np.where(len(row.TYPE) > 1, 'MIXED', row.TYPE[0]), axis = 1)
groups

# CASE
# 1           A
# 2       MIXED
# 3           B
# dtype: object

templateUrl 应该用作常规做法，以保持组件定义清洁。

官方的ng2教程将有助于澄清一些基本问题，它帮助了我：https://angular.io/docs/ts/latest/tutorial/

Answer 2

来自Angular2 style guide

|当超过3行时，将模板和样式提取到单独的文件中。

即将推出的离线模板编译器将内联由templateUrl链接的模板。还有Gulp任务可以做到这一点。

Answer 3

官方风格指南

https://angular.io/styleguide#!#05-04

可能会建议您将样式和模板隔离到不同的文件中。

但与此同时，如果您要发布组件，单个组件文件将使其变得简单和独立。所以这是关于你的要求。如果您希望独立地重用组件，那么将模板文件嵌入到组件中的方法将获胜。最后，这是你的选择。

希望这对你有所帮助。谢谢。

Answer 4

模板网址应该用于编写HTML代码，原因有两个： 1.关注点分离：用于项目开发的惯例。 2.易于调试：在各种IDE中你可以使用html lint插件，以便在html中找到问题。

如果您的html是一行或两行，那么您可以内联使用它。

Angular 2模板约定

4 个答案: