加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

创建一个通用的angularjs listController

发布时间:2020-12-17 17:13:59 所属栏目:安全 来源:网络整理
导读:Angular ui-router允许我解决我可以在控制器中使用的不同注入. 我创建了一个简单的通用ListController,在ui-router中我注入了一个对象,该对象包含特定于该特定视图的CRUD函数以及模板. 因此,举例来说,假设我有2个具有相同“crud”语法的服务: addPerson(per
Angular ui-router允许我解决我可以在控制器中使用的不同注入.

我创建了一个简单的通用ListController,在ui-router中我注入了一个对象,该对象包含特定于该特定视图的CRUD函数以及模板.

因此,举例来说,假设我有2个具有相同“crud”语法的服务:

addPerson(person,callback){}
deletePerson(person,callback){}
editPerson(person,callback){}
....
addCar(car,callback){}
deleteCar(car,callback){}
editCar(car,callback){}
....

我创建了一个映射对象,将这些服务的CRUD函数映射到我的通用控制器,该控制器通过ui.router注入.

GenericController:

controller('ListCtrl',['$scope','itemList','functions',function ($scope,itemList,functions) {
    $scope.itemList = itemList;

    $scope.addItem = function(){
        functions.add($scope.item,callback);
    }
    .....
}

路由器:

.state('app.people',{
            url: '/people',templateUrl: 'views/people.html',resolve: {
                    functions: ['People',function(People){
                        return {
                        add: People.createPerson,update: People.updatePerson,delete: People.deletePerson,getItemList: People.getPeopleList
                    }
                    }],itemList: ['$q','People',function($q,People){
                var deferred = $q.defer();
                    People.getPeopleList(function(resp,status){
                        deferred.resolve(resp);
                    });
                    return deferred.promise;
                }],},controller: 'GenericController'
        })

因此,您只需在其状态定义中注入不同的函数映射,就可以将它与汽车一起使用.

奇迹般有效.

但现在我希望能够在div中使用我的控制器,而不仅仅是在完整视图中.现在问题在于:

如果我使用ng-controller指令,注入器将不知道提供什么作为’itemList’或’functions'(它是映射对象),但如果我通过$controller对象实例化它,那么它赢了’有自己的范围,我得到了一个

Unknown provider: $scopeProvider <- $scope

因为它无法创建自己的子范围..
我想我可以通过$rootScope创建一个新的范围.$new()或类似的东西,但感觉太像黑客了,而且因为我是棱角分明的新手,我认为这对于像这个..

有小费吗?

解决方法

为了将来的参考,我最终编写了一个通用控制器系统和微型专用控制器 that extend them.

对于上面的示例,通用控制器由“PeopleController”和“CarController”子类化.在控制器代码的开头,每个控制器代码都会执行以下操作:

controller('PeopleController','peopleService',peopleService) {
angular.extend(this,$controller('listController',{$scope: $scope,functions:{

        add: peopleService.addPerson,remove: peopleService.removePerson,[...]

    }}));

    $scope.people = $scope.itemList;

}

所以现在我甚至可以在ng-controller指令中自己实例化控制器,并且它们将使用通用控制器来处理所有CRUD方法.

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读