这篇文章主要介绍Angular4中如何实现绑定和分包，文中介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们一定要看完！
创新互联服务项目包括铁西网站建设、铁西网站制作、铁西网页制作以及铁西网络营销策划等。多年来，我们专注于互联网行业，利用自身积累的技术优势、行业经验、深度合作伙伴关系等，向广大中小型企业、政府机构等提供互联网行业的解决方案，铁西网站推广取得了明显的社会效益与经济效益。目前，我们服务的客户以成都为中心已经辐射到铁西省份的部分城市，未来相信会继续扩大服务区域并继续获得客户的支持与信任！
src目录下的app/app.component.ts文件是一个标准的angular4组件的结构。
上面@component()括号内template属性里用`(这个符号不是单引号，而是键盘1左边、tab键上面的那个符号)包裹的是View，下面export的class部分是Controller。
希望实现的效果长这个样子：
万里长征第一步，先从修改View开始。
修改temlate里的HTML文件，改成下面的样子：
Hello,World
你好,gundam meister
海牛高达海牛高达 NewType
上面部分先充当项目简介。
中间的span假装是高达列表。
下面的div包裹的两个span假装是高达详情。
刷新页面，现在是这个样子的：
好吧我承认和效果图比起来是挫了一点，但是现在先专注于功能实现。
需要实现的功能是：点击高达列表，可以显示高达详情。
正常的情况下，当然不会用常量去渲染页面。而如何沟通Controller和View就是Angular用Model干的事情：绑定。
绑定：你有我有全都有。
在同一个组件（component）内，在class（Controller）里定义的变量名，可以直接在template（View）里使用。
@Component({
selector: 'my-app',
template: `
Hello,World
你好,gundam meister
{{name}}
{{name}}
{{type}}
`
})
export class AppComponent {
name = '海牛高达';
type = 'NewType';
}刷新页面，依然可以显示：
当然，gundam其实是一个类，所以现在是model上场的时候了。
定义一个类 gundam：
class Gundam {
name: string;
type: string;
}改写name和type，让他们成为属性值而不是string常量:
gundam: Gundam = {
name: '海牛',
type: 'NewType'
};typescript 的语法有点奇怪，定义某个变量是某种类型的写法，是变量名在前变量类型在后。
改变temple里的引用：
Hello,World
你好,gundam meister
{{gundam.name}}{{gundam.name}} {{gundam.type}}
刷新页面:
继续review代码。
主页展示的是一个gundam列表而不是某一个gundam，所以用一个gundam数组去冒充数据。
const gundams: Gundam[] = [
{name: '海牛高达', type: 'NewType'},
{name: '巴巴托斯', type: '近战'},
{name: '力天使', type: '射击'}
];之前的angular提供了ng-repeat的标签来循环列表，不过现在4.0以上的时代变成了标签里一个特殊的修饰：*ngFor。
修改class里的代码，定义一个变量gundams接受数组：
gundams = GUNDAMS;
修改template，用*ngFor循环解析数组，进行数据渲染：
