Hello, I have a directive with a select input. Upon change of the select
input, I would like to do something in the parent controller. What's the
best way to do this?
angular.module('myApp')
.directive('projectSelect', ['$rootScope', function($rootScope) {
var directive = {
restrict: 'A',
templateUrl: 'app/directives/projectSelect.directive.html',
controller: 'ProjectSelectCtrl',
controllerAs: 'vm',
bindToController: true,
link: function($scope, $element, $attributes) {
$rootScope.$broadcast('projectSelectLoadedEvent');
}
};
return directive;
}])
.controller('ProjectSelectCtrl', ['$scope', '$location', 'ProjectFactory',
'UserFactory',
function($scope, $location, ProjectFactory, UserFactory) {
var vm = this;
vm.projects;
vm.projectId = ($location.search()['projectId']) ?
$location.search()['projectId'] : 0;
vm.isLoggedIn = UserFactory.isLoggedIn;
vm.includePublic = !UserFactory.isLoggedIn();
vm.getProjects = getProjects;
function getProjects() {
vm.projects = ProjectFactory.getProjects(vm.includePublic);
}
getProjects();
}])
Here's the controller I would like to do something with the information of
the select change:
.controller('TemplateCtrl', ['$rootScope', '$location',
function($rootScope, $location) {
var vm = this;
vm.projectChanged = projectChanged;
function projectChanged() {
$('#projects').trigger('change');
}
}]);
I realize the jquery code in TemplateCtrl isn't preferred, but it's a bit
of a hack as we are transitioning from jquery & jsp to angularJs. I would
like to trigger the projectChanged function in TemplateCtrl when the select
box is changed as well as when it is initially populated from a rest
service if projectId > 0.
--
You received this message because you are subscribed to the Google Groups
"AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
