Как повторно использовать один контроллер для двух разных видов?
Я определил один контроллер и применил его к двум представлениям с небольшими отличиями.
Angular код:
app.controller('MyCtrl', function($scope) {
$scope.canSave = false;
$scope.demo = {
files : [{
filename: 'aaa.html',
source: '<div>aaa</div>'
}, {
filename: 'bbb.html',
source: '<div>bbb</div>'
}]
}
$scope.newFile = function(file) {
$scope.demo.files.push(file);
}
$scope.$watch("demo.files", function(val) {
$scope.canSave = true;
}, true);
});
Просмотр 1:
<div ng-controller="MyCtrl"></div>
Вид 2:
<div ng-controller="MyCtrl"></div>
Пример кода очень прост, но в моем реальном проекте есть много кода и логики.
В представлениях 1 и 2 есть почти те же функции, только с несколькими отличиями, но мне нужно написать код для каждого из них в контроллере.
Я не хочу создавать для них 2 разных контроллера, потому что они имеют большую логику. Я не хочу переводить логику в службу, чтобы делиться ею между двумя контроллерами, потому что логика не является обычной для службы.
Есть ли другой способ сделать это?
Ответы
Ответ 1
В данных условиях я мог бы делать что-то вроде
function MyCommonCtrl(type){
return function($scope, $http) {
$scope.x = 5;
if(type = 't1'){
$scope.domore = function(){
}
}
....
....
}
}
angular.module('ng').controller('Type1Ctrl', ['$scope', '$http', MyCommonCtrl('t1')]);
angular.module('ng').controller('Type2Ctrl', ['$scope', '$http', MyCommonCtrl('t2')]);
Тогда
<div ng-controller="Type1Ctrl"></div>
и
<div ng-controller="Type2Ctrl"></div>
Ответ 2
Я не знаю вашу конкретную настройку, но ваши 2 контроллера могут наследовать от общего предка.
Type1Ctrl.prototype = new MyCtrl();
Type1Ctrl.prototype.constructor = Type1Ctrl;
function Type1Ctrl() {
// constructor stuff goes here
}
Type1Ctrl.prototype.setScope = function() {
// setScope
};
Type2Ctrl.prototype = new MyCtrl();
Type2Ctrl.prototype.constructor = Type2Ctrl;
function Type2Ctrl() {
// constructor stuff goes here
}
Type2Ctrl.prototype.setScope = function() {
// setScope
};
Ответ 3
Я также столкнулся с аналогичной проблемой, и наследование наследования решило мою проблему.
Я хотел "повторно использовать" контроллер для наследования общего состояния/модели ($ scope) и функциональности (функции контроллера, привязанные к $scope)
Как описано в "Пример наследования видимости области видимости" , я прикрепляю родительский контроллер к внешнему элементу DOM и дочернему контроллеру во внутреннее. Масштаб и функции родительского контроллера "сливаются" без проблем в дочерний.
Ответ 4
Вот еще один вариант. Немного изменен из этот пост в блоге
app.factory('ParentCtrl',function(){
$scope.parentVar = 'I am from the parent'
};
});
app.controller('ChildCtrl', function($scope, $injector, ParentCtrl) {
$injector.invoke(ParentCtrl, this, {$scope: $scope});
});
вот плункер