angularJS目前是前端超级火的框架 ， 通过ng-指令 ， 可以用来开发webAPP ， 它的特点就是有很多指令 ， 今天咪咪我就来给大家讲讲怎样使用angularJS 。 注意 ， 学习angularJS必须要会html ， css和JS哦 。 工具/材料 电脑
webstorm
angularJS
操作方法 01 第一步 ， 新建一个html页面 ， 然后引入angularJS插件 ， 注意路径一定要对哦 。 不会路径的 ， 请学好JS再来学习angularJS哦 。
文章插图
02 【angularJS怎样用呢】之后我们定义一个div元素 ， 然后给这个div元素添加指令ng-app ， 引号里面可以没有内容（学习而已 ， 不需要太严格） 。 ng-app就是定义angularJS的范围 ， 在div里面定义说明div里面是angularJS的范围 ， 外面不是 。
文章插图
03 接着定义一个表单元素input ， 然后用ng-module绑定一个变量 ， 变量名随便 ， 这样 ， 我们往表单里面输入的内容就会绑定到ng-module里面的变量name了 。 需要特别注意的是 ， ng-module只对表单元素有效哦 。
文章插图
04 之后 ， 我们另设一个p元素 ， 然后用两个花括号加变量名来显示数据 ， 这是一个表达式 。
文章插图
05 接着我们打开浏览器 ， 然后在input输入框里面输入数据 。
文章插图
06 如图 ， 我们在输入框里面输入什么数据 ， 下面就会解析成同样的数据 ， 这就是数据双向绑定 ， 只要一个变 ， 另外一个也会变的 。
文章插图
07 花括号加变量名所代表的表达式 ， 比如这个{{name}} ， 只有在ng-app范围内才会被解析 。 比如我在div外面设置了一个p ， 并且p 里面有表达式 。
文章插图
08 然后在浏览器里面观察 ， 可以看到 ， 表达式被原样输出了 ， 没有被解析成功 。 这是因为第二个表达式不在div里面 ， 也就是说不属于angularJS的范围 。
文章插图
09 而我们再把ng-app放置到body标签上面 ， 其他不变 ， 然后保存 。
文章插图
10 这时候 ， 就可以看到 ， 所有的表达式都可以被解析成对应的数据了哦 。 这就说明 ， 了解angularJS范围是非常重要的哦 。
推荐阅读
- 怎样在photoshop中给文字加边框
- 怎样科学繁殖大花绣球
- 怎样盆栽无花果
- 怎样的武夷岩茶才会越存越好？
- 怎样清除上网历史记录
- 怎样用CAD画一个路标箭头？
- html中怎样设置定时器
- 怎样使用手机地图
- 宫廷秘传怎样完成和敦郡王的羁绊剧情
- 怎样用CAD画一个餐桌？