㈠ 利用angularjs怎么编写前端代码
先进入官网来。官网首页就能够源下载，点击箭头所示图标，下载所需文件。
点击以后弹出选择对话框，如图所示，我们可以直接点击download图标，这时下载的就只是基本文件，选择zip后我们能够将整个文件夹下载下来，这里随便自己喜欢。
下载完成以后，解压文件，开始准备写项目。如果下载的是单个文件，就不需要解压，下载的就只是angular.js文件，只需要直接饮用就可以了。
打开编辑器，创建一个新的项目，在项目中导入我们下载的文件，再创建一个新的文档：index.html。在文档中我们需要导入Angularjs库，这里我们可以看到出现了很多其他的文件，这些文件有各自的意义，以后再说明。
先导入如图所示的这行代码，Angularjs基本库已经导入了，说明我们可以开始使用它们。
㈡ 在AngularJS中怎么实现读取JSON数据后，根据同一店铺名称下循环购买的商品
function newgoods(goods){
var mygoods = [];
for (var i = 0; i < goods.length; i++) {
if(mygoods[goods[i].sstype]){
mygoods[goods[i].sstype].push(goods[i]);
}else{
mygoods[goods[i].sstype] = [];
mygoods[goods[i].sstype][0] = goods[i]
}
};
return mygoods;
}
var ngoods = newgoods(goods);
console.log(ngoods);
把数据处理一下再用吧，要用两次ng-repeat
㈢ angular js 带复选框购物车怎么写
前段时间研究过这个，并且写了一个购物车的小例子，今天一个偶然的机会提起，可惜忘了差不多了，糊里糊涂的也没说清楚。翻出来，提醒下自己，保持一颗学习的心，顺便再复习一遍。
先上一个最终的效果图
构图比较简单，主要功能：
1. 点击购买的时候 进行数量的增加或者条目的增加，同时总价格变化；
2. 进行删除的时候，删除当前条目，总价变化；
3. 进行数目增加减少的时候，总价格变化；
好，下面说代码，抓耳挠腮的想想，有点久远印象不太深刻了；
关于angular的基本用法，这里就不唠叨了，网上好多的教程；
首先是商品列表，这里自己随意列举了一些
<script>
var items = [{
id : '1',
name : '蜂蜜',
price : 30.00
},{
id : '2',
name : '黄豆酱',
price : 15.8
},
{
id : '3',
name : '护手霜',
price : 15.00
},
{
id : '4',
name : '保温杯',
price : 29.9
},
{
id : '5',
name : '鼠标',
price : 39.9
},{
id : '6',
name : '米老头',
price : 8.8
}];
//购物车中的数据;
var boughtList = {};
</script>
主要的html代码，重新注释下也让自己再熟悉一遍
<div class="wrap" ng-controller="showItem"><!-- ng-controller ng的语法 -->
<h5>商品列表</h5>
<div class="left itembox border" >
<ul>
<li class="left" ng-repeat="value in items" item-id={{value.id}}>
<p>{{value.name}}</p>
<p> {{value.price}}</p>
<p>
<a href="javascript:void(0);" ng-click="buyAction($event);"
name={{value.name}} price={{value.price}} item-id={{value.id}} >购买</a>
<!-- dom 事件时的$event 就相当于普通dom事件中的window.event 对象-->
</p>
</li>
</ul>
</div>
<!-- 购物车中的数据 -->
<div class="boughtlist border">
<ul>
<li ng-repeat="value in boughtList" item-id={{value.id}}>
<span>{{value.name}}</span>
<span>{{value.price}}</span>
<span style="width:100px;" item-id={{value.id}}>
<a href="javascript:void(0);" ng-click="value.num=value.num+1;changeNum($event,value.num);" >+</a>
<input class="border" type="number" min=0 ng-model="value.num" ng-init="value.num=1" ng-change="changeNum(value.id,value.num);"/>
<!-- 这里的ng-change 是值发生变化时触发的事件，其实这里我原先想处理成 一个自动的mvc过程，无果，只好加事件了-->
<a href="javascript:void(0);" ng-click="value.num=value.num-1;changeNum($event,value.num);">-</a>
</span>
<a href="javascript:void(0);" item-id={{value.id}} ng-click="delItem($event);" >删除</a>
</li>
</ul>
<p ng-init=0 >总价格：{{ total | number:1}}</p>
<!-- angular的优势体现，number：1也就是number数据，小数点后一位。-->
</div>
我记得，当时觉得比较麻烦的是 input没有ng-blur事件；
看下js代码
var ng = angular;
var myapp = ng.mole('myapp',[]);
var common = {
getTotal : function(total){ //每次重新清零 算出总价，这样的话为什么还要传total参数？当时怎么想的？
total = 0;
for(var k in boughtList){
if(boughtList[k]){
if(boughtList[k].num <=0){
boughtList[k].num = 0;
}
total += boughtList[k].num*boughtList[k].price;
}
}
return total;
}
}
myapp.controller('showItem',function($scope){
$scope.items = items;
$scope.boughtList = boughtList;
$scope.total = 0;
for(var k in boughtList){
if(boughtList[k]){
$scope.total += boughtList[k].num*boughtList[k].price;
}
}
$scope.buyAction = function($event){
var el = $event.target;
var id = el.getAttribute('item-id');
if(boughtList[id]){
boughtList[id].num += 1;
}else{
var arr = [];
arr.name = el.getAttribute('name');
arr.price = el.getAttribute('price');
arr.num = 1;
arr.id = id;
boughtList[id] = arr;
}
$scope.total = common.getTotal($scope.total);
}
$scope.delItem = function($event){
var li = $event.target.parentNode;
li.parentNode.removeChild(li);
var id = $event.target.getAttribute('item-id');
if(boughtList[id]){
delete boughtList[id];
}
$scope.total = common.getTotal($scope.total);
}
$scope.changeNum = function($event,num){
var id;
if(typeof $event == 'string'){
id = $event;
}else{
id = $event.target.parentNode.getAttribute('item-id');
}
boughtList[id].number = num;
$scope.total = common.getTotal($scope.total);
}
});
㈣ 如何用Angular写界面
首先你需要有良好的js，css，html基础以及开发经验，
然后写界面之前你要明白框架(MVC)的概念，明白angularJS的操作以及语法，
然后安装angularJS
然后在你的项目里面创建angular应用程序 ng-app 表示angular是可以读取的范围
然后添加你需要控制的地方ng-controller
写页面
不懂的话自己复制运行自己看吧 实例：
<!DOCTYPEhtml>
<html>
<head>
<metacharset="utf-8">
<scriptsrc="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<style>
table,th,td{
border:1pxsolidgrey;
border-collapse:collapse;
padding:5px;
}
tabletr:nth-child(odd){
background-color:#f1f1f1;
}
tabletr:nth-child(even){
background-color:#ffffff;
}
</style>
<bodyng-app="myApp">
<tableng-controller="myCtrl"border="1">
<trng-repeat="xinrecords">
<td>{{x.Name}}</td>
<td>{{x.Country}}</td>
</tr>
</table>
<script>
varapp=angular.mole("myApp",[]);
app.controller("myCtrl",function($scope){
$scope.records=[
{
"Name":"AlfredsFutterkiste",
"Country":"Germany"
},
{
"Name":"Berglundssnabbk",
"Country":"Sweden"
},
{
"Name":"CentrocomercialMoctezuma",
"Country":"Mexico"
},
{
"Name":"ErnstHandel",
"Country":"Austria"
}
]
});
</script>
</body>
</html>
㈤ 如何用angularjs实现抛物线购物车效果
、使用任何语言创建一个服务端：
public class ShoppingCar
{
public string Title { get; set; }
public decimal UnitPrice { get; set; }
public int Count { get; set; }
}
public ActionResult GetCar()
{
List<ShoppingCar> cars = new List<ShoppingCar>
{
new ShoppingCar { Title="苹果",Count=1,UnitPrice=2.5m},
new ShoppingCar { Title="香蕉",Count=3,UnitPrice=1.5m},
new ShoppingCar { Title="苦瓜",Count=1,UnitPrice=3.5m},
new ShoppingCar { Title="黄瓜",Count=3,UnitPrice=2.2m}
};
return Json(cars,JsonRequestBehavior.AllowGet);
}
㈥ 怎样用angular写事件委托
在angular中，默认不支持事件代理，但是在处理大量数据的时候，尤其是一些列表的时候，事件代理是必须的，那应该怎么样实现这个代理呢，并且用起来很方便呢，此处实现一个，有参考nishp1的angular-delegate-event实现；增加了对象式代理，详见使用方法
使用方法：
<ul ngd-click="itemClick($event, item)" selector="a">
<li ng-repeat="item in items"><a href="javascript:;">item.name</a></li>
</ul>
<ul ngd-event="itemClick($event, item)" event-name="click" selector="li">
<li ng-repeat="item in items"><a href="javascript:;">item.name</a></li>
</ul>
<ul ngd-event="{click:'itemClick($event, item)','dblclick':'itemDblClick($event)'}" selector="{click:'li',dblclick:'a'}">
<li ng-repeat="item in items"><a href="javascript:;">item.name</a></li>
</ul>
内置的一些事件：click, dblclick, mousedown, mouseup, mouseover, mouseout, mousemove, mouseenter, mouseleave
controller写法
// 依赖DelegateEvents
var app = angular.mole('app', ['DelegateEvents']);
app.controller('listCtl', function($scope) {
$scope.itemClick = function(e, item) {
// do something...
// 注：
// e 原始的event对象，但是增加了delegationTarget => 代理target元素
//
// 对于selector这块，如果引用了jQuery的话，则支持的是jquery的选择器
// 对于支持matchesSelector的浏览器来说，支持的就是标准的选择器；
// 否则的话只能支持tagName...
};
// itemDblClick 同理。。
})
㈦ 用angular写这样的效果：当点击按钮一和按钮二切换背景颜色和字体颜色；代码尽量可以运行效果，谢谢！！
哈哈，求作业的吧？
分数高我也不答，自己学学吧，没坏处的
㈧ angular js 实现购物车功能，怎么在不同的页面之间更新数据
两个页面传值要用后台服务器，你是指1.html和2.html这样的吗？这和angular没有关系，angular是用来内实现html和js的绑定的
html:<input ng-model="zs.name"/>
js:app.controller('控制器的容名字',function($scope){
$scope.zs={
name:'张三',
age:18
};
})
这样$scope.zs.name变化会使input的value值改变，同时input的oninput事件触发时会通知$scope.zs.name改变
㈨ 用Angular写页面的时候怎么实时刷新页面
以chrome为例，在设置里阻止网站设置任何数据，这样刷新后就是更改后的页面
这样的缺点是其他页面也会受影响，Angular同在学习中。
㈩ 如何用angular js 写一个confirm
不知道这个confirm是模态框形式的,还是有什么别的要求