Angular学习1

最新推荐文章于 2021-01-06 16:53:04 发布

HurricanGod

最新推荐文章于 2021-01-06 16:53:04 发布

阅读量276

点赞数 1

分类专栏： AngularJS 文章标签： angular

本文链接：https://blog.csdn.net/qq_34332010/article/details/52458960

版权

AngularJS 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

当网页加载完毕，AngularJS 自动开启。Angular操作的是一个作用域
ng-app 指令告诉 AngularJS，在如下代码中div 元素是 AngularJS 应用程序的”所有者”，即anjular作用于整个div域

ng-model 指令把输入域的值绑定到应用程序变量 name。

当在文本框里输入任意内容时，以Hello开头的标题会随着输入文本框里的内容变化而变化

AngularJS 表达式可以包含字母，操作符，变量。
与 JavaScript 表达式不同，AngularJS 表达式可以写在 HTML 中，不支持条件判断，循环及异常，支持过滤器。
- 段落标签’p’里表达式将显示5+5的结果10

ng-init指令用于声明变量并可以为变量赋上初值
ng-bind 指令把应用程序变量 name 绑定到某个段落innerHTML。

<body>

<div ng-app="myApp" ng-init="str1='12'; str2='34'" ng-controller="myCtrl">
  <p>名字 : <input type="text" ng-model="name"></p>
  <h1>Hello {{name}}</h1>
    <br/>
    <p>账号：<input type="text" ng-model="login" width="200" id="loginNum"></p>
    <p>************{{login}}</p>

    <p>{{5+5}}</p>
    <p>{{str1+str2}}</p>
    <p><span ng-bind="str1+str2"></span></p>
    <br/>
    <input ng-model="age">
    <h2>{{age}}</h2>
</div>

<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
    $scope.age = "19";
});
</script>
</body>
</html>

angular.module()方法来声明模块，这个方法可以接受两个参数，第一个是模块的名称，第二个是依赖列表，也就是被注入到模块中的列表对象。

写法：
anjular.module(“app_Name”,[])
如果调用这个方法只传入了一个参数，那么就不是声明模块而是引用模块

anjular js的标准写法:

<script type="text/javascript"
   var app=angular.module("appName",[]);
   //例如在上面<div>元素里有ng-app="myApp"，因此声明模块时应把
   //myApp作为参数传递给angular.module()方法
   app.controller('myCtrl', function($scope) {
    $scope.age = "19";
   //app.controller()方法的第一个参数是控制器的名称
   //$scope对象就是一个普通的JavaScript对象，
   //我们可以在其上随意修改或添加属性。
});
</script>

scope 是一个对象，有可用的方法和属性；可应用在视图和控制器上，创建AngularJS控制器时，可以将$scope对象当作一个参数传递

所有的应用都有一个 $rootScope，它可以作用在 ng-app 指令包含的所有 HTML 元素中,即作用于整个应用中,是各个 controller 中 scope 的桥梁。scope并不负责处理和操作数据，它只是视图和HTML之间的桥梁，它是视图和控制器之间的传送器。

-用 $rootscope 定义的值，可以在各个 controller 中使用

HurricanGod

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Angular学习1

当网页加载完毕，AngularJS 自动开启。Angular操作的是一个作用域 ng-app 指令告诉 AngularJS，在如下代码中div 元素是 AngularJS 应用程序的”所有者”，即anjular作用于整个div域ng-model 指令把输入域的值绑定到应用程序变量 name。当在文本框里输入任意内容时，以Hello开头的标题会随着输入文本框里的内容变化而变化AngularJS
复制链接

扫一扫

专栏目录