augularJS基础



---------------------------------------------------------------------------------------------点击事件-----------------------------------------------------------------------------------------------

<html>

<head>
<meta charset="UTF-8">
<title></title>
<script src="lib/angular.min.js"></script>
<script>
var app = angular.module("gaoynApp", []);

//"$scope"---------->anglarJS提供参数
app.controller("demoC", ["$scope", function($scope) {// 数组 参数一 "$scope",实参  ; 参数二:function($scope) 
//在作用域上定义函数--->有ng-click调用
$scope.sum = function(a, b) {//a ,b 形参
$scope.result = a + b;
}
}]);
</script>
</head>


<body ng-app="gaoynApp">
<div ng-controller="demoC">
<p>{{result}}</p>
<input type="button" value="计算" ng-click="sum(3,2)" />
</div>
</body>

</html>

、没有引用的使用方法

<html>
<head>
<meta charset="UTF-8">
<title></title>
<!--導入anglarjs-->
<script src="lib/angular.min.js"></script>
</head>
<body ng-app>
<!--数据模型层(框中输入的数据作为anglarjs的模型) -->
<input ng-model="abc" />
<p>
<!--视图来展示 数据模型-->
字符串拼接:{{abc+"hello"}}
<!--算术练习-->
算术练习:{{9-2}}
<!--关系运算-->
关系运算: {{9>2}}
</p>
</body>
</html>


---------------------------------------------------------------------------------------引用的使用方法------------------------------------------------------------------------------


<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="lib/angular.min.js"></script>
</head>
<!--body使用anglar应用-->
<body ng-app="gaoynApp">
<div ng-controller="deomCtrl">
来自于控制器的数据
{{name}}

</div>
<p ng-controller="democtr2">
{{myname}}的爱好为:{{hobby}}
</p>
</body>
<script>
/*定义 应用名()*/
var app= angular.module("gaoynApp",[]);
//controller 控制器的名字; 第2个参数数组类型[$scope(由Anglarjs提供的作用域对象)  ]
app.controller("deomCtrl",["$scope",function($scope){
//作用域下面 有个数据name
$scope.name="我的孩子呀,打开你的小眼睛呀!!!!!!";
}]);
//
app.controller("democtr2",["$scope",function($scope){
//数据模型
$scope.myname="高运娜";
$scope.hobby="吃,睡,花钱";
}]);
</script>
</html>


---------------------------------------------------------------------------------------基本指令-----------------------------------------------------------------








  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值