angularjs根据类型动态加载组件

记录开发一些小功能。
用户选择类型时，加载据选的类型的组件进行数据编辑。
项目是在asp.net web site环境中进行。混入angularjs。刚开始时，把angularjs代码包含在asp:UpdatePanel。在运行时，却乱套了，只好去除UpdatePanel，此时才妥妥安稳跑起来。

有几个类型，将会有几个组件，其中2个，如下，

相对应的控制器，

app.controller("eamPCCtrl", ['$scope', 'dataService', function ($scope, dataService) {
    //code... 
    //do something...
}]);

 

另一个组件，

 

app.controller("eamHDCtrl", ['$scope', 'dataService', function ($scope, dataService) {
    $scope.Status = '在用';

    dataService.Statuses().then(function (data) {
        if (data) {
            $scope.Statuses = data;
        }
    });
}]);

onCategoryChange事件的实现，

 

这种是比较原始的方法实现动态加载。
在互联网上，有看到网友使用
angular-ui-router

<script src="Scripts/angular-ui-router/release/angular-ui-router.min.js"></script>

+ 

ocLazyLoad

<script src="Scripts/oclazyload/dist/ocLazyLoad.min.js"></script>

 

一次性把控制器与组件一起加载。