使用指令创建应用 ng-app ng-controller="myCtrl"(必须要有这个)
ng-app 一个应用只能有一个。如果有多个,以第一个为准
ng-model 数据
{{}} 表达式的作用:取数据
//创建一个input来输入数据
<input type="text" ng-model="name"/><br />
//可以接收input的数据并且展示出来
<span>{{name}}</span><br />
//和上面的作用一样只不过这个是绑定
<span ng-bind="name"></span>
<!-- 计算商品总价
sum = price * count;
表达式:
可以进行运算
拼接字符串
进行正则验证
-->
//先创建输入框
单价:<input type="text" ng-model="price" />
数量:<input type="text" ng-model="count" /><br />
//angular有自己的计算输入信息后可以直接展示(也可以用绑定的来计算)
<span>{{price*count}}</span>
ng-click
ng-repeat
ng-repeat="good in goods"
相当于遍历goods数组
数组
ng-controller="myCtrl" 控制器
几个的合集
//一个简单小案例
<body ng-app="myApp" ng-controller="myCtrl">
//建立一个表格
<table border="1px" cellspacing="0px" cellpadding="0px">
<tr><td>商品名</td><td>商品价格</td><td>商品数量</td>
<td>商品总价</td><td>操作</td></tr>
<tr ng-repeat="good in goods" ><td>{{good.gname}}</td>
<td>{{good.gprice}}</td>
<td>{{good.gcount}}</td>
<td>{{good.gcount*good.gprice}}</td>
<td><input type="button" value="删除" ng-click="dele($index)"/>
</tr>
</table>
//调用方法
<script type="text/javascript">
//创建模块儿
//angular 将一些功能封装起来形成模块儿
//依赖注入:
//依赖:就是一个类中用到另外一个类的对象
//注入:将一个对象放入另外一个类
//注意moudle小写
var mo = angular.module("myApp",[]);//参数1.应用名 参数2.依赖注入列表
//创建控制器
mo.controller("myCtrl",function($scope){//$scope 作用域,连接视图和数据的纽带
//定义基本数据类型的数组
// $scope.goods=[1,2,3,4,5,6];
//定义元素是对象的数组
$scope.goods=[{"gname":"足球","gprice":200,"gcount":5},{"gname":"蓝球","gprice":1000,"gcount":3}];
//方法
$scope.dele = function($index){
$scope.goods.splice($index,1);
}
});//参数1.控制器的名字 参数2 回调方法
</script>
</body>