本文目录一览：
请问谁有混淆Angularjs代码的经验
由于AngularJS是通过控制器构造函数的参数名字来推断依赖服务名称的。所以如果你要压缩控制器的JS代码，它所有的参数也同时会被压缩，这时候依赖注入系统就不能正确的识别出服务了。
假如我们的Controller的名称为：BookCtrl，压缩前的代码为：
var BookCtrl = function($scope, $http) { /* constructor body */ };
为了克服压缩引起的问题，只要在控制器函数里面给$inject属性赋值一个依赖服务标识符的数组：
BookCtrl.$inject = ['$scope', '$http'];
另一种方法也可以用来指定依赖列表并且避免压缩问题——使用Javascript数组方式构造控制器：把要注入的服务放到一个字符串数组（代表依赖的名字）里，数组最后一个元素是控制器的方法函数：
var BookCtrl = ['$scope', '$http', function($scope, $http) { /* constructor body */ }];
上面提到的两种方法都能和AngularJS可注入的任何函数完美协作，要选哪一种方式完全取决于你们项目的编程风格，建议使用数组方式
如何使用angularjs处理动态菜单
angularjs处理动态菜单的实现方法：
1、核心angularjs代码：
var testImg=angular.module("appTest",["ms.leafMenu"])
.controller('testCtr',['$scope',function($scope){
$scope.data=[{"id":"1","pid":"0","name":"第一行","children":[{"id":"3","pid":"1","name":"第一行1.1"},{"id":"4","pid":"1","name":"第一行1.2"}]},{"id":"2","pid":"0","name":"第二行","children":[{"id":"5","pid":"2","name":"第二行2.1"}]}];
}]);
angular.module("ms.leafMenu",[])
.directive('msLeafMenu',['$compile',function($compile){
return {
restrict:'EA',
transclude: true,
replace: false,
//template:"li/li",
scope:{
data:'=?',
id:'@?',
pid:'@?',
pvalue:'@?',
showname:'@?',
isstandard:'@?'
},
link:function(scope,element,attrs,leafController){
创建节点数据的方法：
function createTreeData(id,pid,pvalue){
var newData=[];
angular.forEach(scope.data,function(item,index){
if(item[pid]==pvalue){
var children=createTreeData(id,pid,item[id]);
if(children children.length0){
item.children=children;
}
newData.push(item);
}
});
return newData;
}
if(!scope.isstandard){
scope.data=createTreeData(scope.id,scope.pid,scope.pvalue);
}
//向节点增加数据
element.append($compile('ul class="ms_leaf_menu_group"li ng-repeat="row in data" ng-class="{ms_parent_item:(row.children row.children.length0),ms_child_item:(!row.children || row.children.length=0)}"div ng-click="toogle($index)"a {{row[showname]}}/aspan class="glyphicon" ng-class="{\'glyphicon-chevron-right\':(row.children row.children.length0 !row.isopen),\'glyphicon-chevron-down\':(row.children row.children.length0 row.isopen)}" aria-hidden="true"/span/divdiv ng-show="row.isopen"ms-leaf-menu data="row.children" id="id" pid="pid" showname="{{showname}}" pvalue="{{row[id]}}"/ms-leaf-menu/div/li/ul')(scope));
//此处是关键，调用入口处，需要找到index
scope.toogle=function(index){
scope.data[index]["isopen"]=!scope.data[index]["isopen"];
}
}
}
}]);
/script
2、html代码：
body ng-app="appTest"
div ng-controller="testCtr" style=" width:200px; margin-left:auto; margin-right:auto;"
ms-leaf-menu data="data" id="id" pid="pid" showname="name" pvalue="0"/ms-leaf-menu
/div
/body
3、效果图
如何看angularjs源代码
查看angularjs源代码方法如下
大部分JS框架的源代码都可以在Github中找到，angular.js也可以在里面查找，要想在Github中找到相应的源代码，步骤如下：
在浏览器中访问github.com
在右上角的搜索框中输入想要查找的源代码（输入angular.js），按回车搜索
在查询结果中，一般来说第一个结果就是对应的源代码（angular.js）
点进去后，可以在线查看，亦可以点击绿色下拉按钮“Clone or download”，用git复制地址同步源代码到本地，或者打包成zip压缩包下载都本地。
下回来的angularJs+bootstrap模板怎么用?
用angular渲染bootstrap中的tab切换的
思路：先加载scope中的tabs，然后利用后台bootstrap渲染即可。
1、angularjs代码：
angular.module('TabsApp', [])
.controller('TabsCtrl', ['$scope', function ($scope) {
$scope.tabs = [{
title: 'One',
url: 'one.tpl.html'
}, {
title: 'Two',
url: 'two.tpl.html'
}, {
title: 'Three',
url: 'three.tpl.html'
}];
$scope.currentTab = 'one.tpl.html';
$scope.onClickTab = function (tab) {
$scope.currentTab = tab.url;
}
$scope.isActiveTab = function(tabUrl) {
return tabUrl == $scope.currentTab;
}
}]);
2、渲染效果：
