>Hi everybody,
>
>I have 3 different tabs in my form and each tab is handled by its own controller (same js file, though). In each of these html files there is an invoice grid.
>Clicking on the invoice should bring us to a new form.
>
>So, each of the link in the invoice grid is the same and the code is
>
>
><td>
> <a href=""><span ng-click="loadView(result)">{{ result.invoiceNo }}</span></a>
> </td>
>
>where loadView is defined in one controller and it's:
>
>
>$scope.loadView = function (invoice) {
> $scope.$parent.$parent.showForm = false;
> $scope.$parent.$parent.showSearch = false;
>
> $state.go('edit.invoices', { invoiceId: invoice.invoiceNo, accountNameHash: $scope.acctNameHash });
> $rootScope.$broadcast('sm:focus');
> };
>
>So, somehow I'd like to share this function between 3 controllers. I do not see this function as part of the service, obviously.
>
>What are my options? Do I need to repeat the same code in 2 other controllers or there is another way?
>
>Thanks in advance.
Looks as if you're using angular-ui. If that's the case wouldn't a nested state/view be a good solution.
P.S. Don't like the $parent.$parent part. If's inheritantly (no pun intended) fragile since it depends on a known/fixed scope hierarchy....