angular.js学习笔记（一）

1.angular单项数据绑定

2.不要使用控制器的时候：

• 任何形式的DOM操作：控制器只应该包含业务逻辑。DOM操作则属于应用程序的表现层逻辑操作，向来以测试难度之高闻名于业界。把任何表现层的逻辑放到控制器中将会大大增加业务逻辑的测试难度。ng 提供数据绑定 （数据绑定） 来实现自动化的DOM操作。如果需要手动进行DOM操作，那么最好将表现层的逻辑封装在 指令 中
• 格式化输入：使用 angular表单控件 代替
• 过滤输出：使用 angular过滤器 代替
• 在控制器间复用有状态或无状态的代码：使用angular服务 代替
• 管理其它部件的生命周期（如手动创建 service 实例）

3.ng命令

npm i --save 安装指令

ng new 项目名 新建angular 项目

ng build prod 生产环境编译

npm run serve 启动项目

4.json-server 用于快速搭建rest api 安装 ：npm install json-server --save

5.安装angular-cli后死活执行不了ng 命令，

（1）重新安装@angular/cli

npm install -g @angular/cli@latest

（2）查询安装的Node路径

npm get prefix

（3）把刚才的路径配到你的终端配置文件中.zshrc或.bashrc

alias ng="/刚才你得到的路径/lib/node_modules/@angular/cli/bin/ng"
（4）打开terminal(终端)

（5）cd ~ ( 进入当前用户的home目录)

（6）open .bash_profile (打开.bash_profile文件，如果文件不存在就 创建文件：touch .bash_profile 编辑文件：open -e .bash_profile)

（7）直接更改弹出的.bash_profile文件内容，修改

（8）command + s 保存文件，然后关闭 。

（9）在terminal(终端)中输入 source .bash_profile (使用刚才更新之后的内容)。

参考链接：https://blog.csdn.net/yaya_lovepiggy/article/details/79294500

6.angular项目结构

src下项目结构

app                       包含应用的组件和模块，我们要写的代码都在这个目录
assets                    资源目录，存储静态资源的 
environments          环境配置
index.html               整个应用的根html，程序启动就是访问这个页面
main.ts                   整个项目的入口点，Angular通过这个文件来启动项目
polyfills.ts               导入一些必要库，为了让Angular能正常运行在老版本下
styles.css                全局的样式
tsconfig.app.json     TypeScript编译器的配置,添加第三方依赖的时候会修改这个文件
test.ts                    自动化测试用的