angular—入门

angular—入门

一、参考资料

  1. MDN:
    https://developer.mozilla.org/zh-CN/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Angular_getting_started
  2. 菜鸟教程:https://www.runoob.com/angularjs/angularjs-tutorial.html
  3. demo:https://blog.csdn.net/hbiao68/article/details/107461253

二、环境搭建

三、构成

AngularJS 应用组成如下:

  1. View(视图), 即 HTML。

  2. Model(模型), 当前视图中可用的数据。

    • scope 是模型:scope 是一个 JavaScript 对象,带有属性和方法,这些属性和方法可以在视图和控制器中使用。
    • 根作用域:所有的应用都有一个 $rootScope,它可以作用在 ng-app 指令包含的所有 HTML 元素中。
      • $rootScope 可作用于整个应用中。是各个 controller 中 scope 的桥梁。用 rootscope 定义的值,可以在各个 controller 中使用。
  3. Controller(控制器), 即 JavaScript 函数,可以添加或修改属性。

    • AngularJS 控制器:
      • AngularJS 应用程序被控制器控制。
      • ng-controller 指令定义了应用程序控制器。
      • 控制器是 JavaScript 对象,由标准的 JavaScript 对象的构造函数 创建。
      • 控制器也可以有方法(变量和函数)
      • 控制器定义有两个参数:
        • 第一个是控制器名称(字符串)
        • 第二个是一个函数或者数组
          • 当为函数时, 表示控制器的构造函数
          • 当为数组时, 数组前面的元素为构造函数用到的字符串形式的服务, 数组最后一个元素为构造函数, 此时构造函数的参数列表和数组前面元素是一一对应的, 例如:
          	module.controller("myController", function ($scope, $http, $timeout){//});
          	module.controller("myController", ["$scope", "$http","$timeout", function (scope,http ,timeout ){//}]);
             ```
          
          
          

核心:模型和控制器。

三、常用语法

指令用法
AngularJS 指令是以 ng 作为前缀的 HTML 属性。
ng-init指令初始化 AngularJS 应用程序变量
ng-app指令告诉 AngularJS,
元素是 AngularJS 应用程序 的"所有者"。
ng-model指令把输入域的值绑定到应用程序变量 name。
ng-bind指令把应用程序变量 name 绑定到某个段落的 innerHTML。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值