首先讲一下wamp服务器的使用，安装好wamp后你需要打开服务器，然后点击启动所有服务，这时我弹出一个对话框，说
Could not execute menu item(internal error)，[Exception] Could not perform service action:服务尚未启动。这是因为我的80端口被公司内部IP地址占用；所以我需要修改80端口。具体做法是左键点击右下角的wamp图标，然后找到Apache下的httpd.conf文件，用你的编辑器打开（也可用记事本，但无格式），找到里面的Listen：80（搜索可能会找不到需要人工查找，且80前面可能还有数字），将80改成8080或者其他端口。然后保存重启wamp就可以了，图标绿色就可以了。
下面说一下angularjs某个版本（具体不详）中的get方法无法调用的问题，这不知道是我的原因还是它的原因，我下载的版本在Ajax发起请求时弹出$http.get(...)...is not a function.找了好久也没找到错误。最后换了一个版本1.2.20，就成功请求到了json文件，所以希望广大朋友在出错时，注意是不是文件本身有bug。
总结：今天完成了第一个demo。bootstrap和angular结合实现数据双向绑定。附上code：
var model = {
user:"Adam"
};
var app = angular.module("myApp",[]);
app.run(function ($http) {
$http.get("json1.json").success(function (data) {
model.items = data;
})
});
app.filter("checkedItems",function () {
return function (abc,showComplete) {
var resultArr = [];
angular.forEach(abc,function (item) {
if (item.done == false || showComplete == true) {
resultArr.push(item);
}
});
return resultArr;
}
})
app.controller("myCtrl",function ($scope) {
$scope.todo = model;
$scope.count = function () {
var count = 0;
angular.forEach($scope.todo.items,function (item) {
if (!item.done) {
count++
};
});
return count;
};
$scope.warningLevel = function () {
return $scope.count( ) < 3?"label-success":"label-warning";
};
$scope.addNewItem = function (things) {
$scope.todo.items.push({action:things,done:false});
}
})
{{todo.user}}to do list {{count()}}
ps：josn模拟数据
[{"action":"Zuy flowers","done":false},
{"action":"Auy shoes",sans-serif; line-height: 1.3;">
{"action":"Duy fruits","done":true},sans-serif; line-height: 1.3;">
{"action":"Buy call Joe","done":false}]
| {{item.action}} |
| done |
|---|
| description |
|---|