# Angular項目測試
## 項目結構
## bower.json文件
~~~js
{
"name": "ng1",
"description": "",
"main": "",
"license": "MIT",
"homepage": "",
"ignore": [
"**/.*",
"node_modules",
"bower_components",
"test",
"tests"
],
"dependencies": {
"angular": "1.2.18"
}
}
~~~
## index.html文件
~~~html
<!DOCTYPE html>
<html lang="en" ng-app="myapp">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="bower_components/angular/angular.min.js"></script>
<script src="js/my.js"></script>
</head>
<body>
<div ng-controller="app_c">
<ul>
<li ng-repeat="item in data"> {{item}}</li>
</ul>
</div>
</body>
</html>
~~~
## js/my.js文件
~~~js
//定義angular模塊
var app=angular.module('myapp',[]);
//定一個控制器
app.controller('app_c',['$scope',function ($scope) {
//數據模型
$scope.data=['aaaa','bbbbbbb','cccccccc','ddddddddddd','eeeeeeeee'];
}]);
~~~
## 運行結果:
- Angular簡介
- angular1資料網站
- Angular初級部分
- 打破傳統的前端
- Angular基本組成部分
- Angular環境搭建
- Angular項目測試
- Angular基礎概念
- Angular模塊
- Angular控制器
- Angular指令
- Angular表達式
- Angular視圖
- Angular基礎實戰
- Angular模塊創建和使用
- Angular控制器和模型創建
- scope對象
- 控制器中調度window對象和document對象
- Angular表達式調度過濾器
- Angular中的ng模塊全局方法
- Angular模板應用
- 使用指令復制元素
- 使用指令隱藏顯示元素
- Angular指令ng-if
- ng-src和ng-href
- Angular處理樣式
- Angular作用域事件傳遞
- 表單中的元素
- Angular初學者常見的坑
- 再論雙向綁定
- Angular中級部分
- Angular路由機制
- ui-router管理狀態
- ui-router狀態嵌套和視圖嵌套
- ui-router多個命名的視圖
- ui-router路由控制
- 自定義指令
- 自定義過濾器
- Angular項目目錄結構
- Angular服務
- Angular高級部分
- Angular依賴注入
- README