发表于: 2019-09-27 21:50:48
1 799
今天完成的事情:
今天主要对整个angular学习做了个大概的了解,完成了angular2的环境搭建,开始在网上跟着做了会英雄指南编辑器,反正还是懵逼状态
明天计划的事情:
一边跟着做英雄编辑器,一遍补充知识点
遇到的问题:
全是问题,一步步来吧
收获:
Angular的特性:
双向数据绑定
跨平台
开发渐进式应用
统一平台SSR支持
代码拆分 按需加载
提高生产率 Angular CLI
各种IDE支持 推荐VS Code
测试支持
拥抱W3C标准(动画、组件,表单验证等)
等等
Angular的八个主要构造块:
模块
组件
模板
元数据
数据绑定
指令
服务
依赖注入
关于Typescript,我没太看明白,反正暂时知道是javascript的超集,先当做javascript使用,后面遇到问题在回来研究。
angular环境搭建:
angular建立在node.js的基础上,首先先下载node.js
然后在命令行安装Angular CLI
npm install -g @angular/cli
创建工作区:
运行 CLI 命令 ng new 并提供 my-app (这个可以自定义名字)名称作为参数
ng new my-app
ng new 命令会提示你提供要把哪些特性包含在初始应用中。按 Enter 或 Return 键可以接受默认值。
运行应用
Angular CLI 中包含一个服务器,方便你在本地构建和提供应用。
转到 workspace 文件夹(my-app)。
使用 CLI 命令 ng serve 和 --open 选项来启动服务器。
cd my-app ng
serve --open
在官网演示上知道的东西明天深入了解下:
1、结构指令例如:*ngFor *ngIf
结构指令通常通过添加,删除和操作他们所附加的元素来塑造或重塑DOM的结构。任何带有星号的*指令都是结构指令
2、插值语法{{ }}。插值将属性的值呈现为文本
3、属性绑定
4、事件绑定
组件
组件定义了用户界面或UI中的职责范围,使您可以重用UI功能集。您已经使用产品列表组件构建了一个。
一个组件由三部分组成:
处理数据和功能的组件类。在上一节中,share()组件类中的产品数据和方法分别处理数据和功能。
确定UI 的HTML模板。在上一部分中,产品列表的HTML模板显示每个产品的名称,描述和“共享”按钮。
定义外观的特定于组件的样式。尽管产品列表未定义任何样式,但这是组件CSS所在的位置。
Angular应用程序包含一个组件树,其中每个Angular组件都有特定的用途和职责。
组件交互的部分内容
将数据从父级组件传递到子级组件,拦截父级组件的值并对其执行操作以及检测并处理输入属性值的更改的更多信息
侦听子组件中的事件,读取子属性或调用子方法以及使用服务在组件之间进行双向通信
评论