如何在多个控制器中重用一个函数

Rey*_*raa 7 angularjs angularjs-directive angularjs-service

我有多个路由器的多个控制器:

app.controller('FirstController', function ($scope) {
  $scope.func = function () {
    console.log('route 1');
  }
}
app.controller('SecondController', function ($scope) {
  $scope.func = function () {
    console.log('route 2');
  }
}
...
Run Code Online (Sandbox Code Playgroud)

以及使用$scope.func这种方式的指令:

app.directive('thedirective', function () {
  return {
    link: function (scope, $element, attrs) {
      $scope.func(attrs.thedirective);
    }
  }
});
Run Code Online (Sandbox Code Playgroud)

$scope.func每个控制器都有所不同.我希望$ scope.func在route1中记录"route 1",FirstController是当前控制器,在路由2中记录"route 2",但只有"rout 1"是我在控制台得到的.请你告诉我为什么改变路线不会改变$指令的范围?

Dil*_*ala 5

在AngularJS中,如果函数在控制器中常用.

最佳实践是使用服务或工厂,它将注入控制器.

app.factory('commonService', function ($scope) {
     var obj= {};
      obj.func = function () {
        console.log('route 1');
      }
     obj.func1 = function () {
        console.log('route 2');
      }
  return obj;
    }
    app.controller('FirstController', function ($scope,commonService) { 
        console.log('route 1' + commonService.func());  
    }
    app.controller('SecondController', function ($scope,commonService) { 
        console.log('route 2' + commonService.func1());  
    }
Run Code Online (Sandbox Code Playgroud)

当我们谈论指令时,指令的范围将是一个控制器,无论是指令控制器还是我们定义的外部控制器.

<div ng-controller="firstController">
<your-directive />
</div>

<div ng-controller="secondController">
<your-directive />
</div>
Run Code Online (Sandbox Code Playgroud)


Rey*_*raa 2

隔离范围是我用来重用一个定义不同的函数的方法,它是多个控制器。
根据文档,当您隔离指令的范围时,例如:

scope: {
  myIsolatedFunc: '='
}
Run Code Online (Sandbox Code Playgroud)

Angular 将查找名为myIsolatedFunc元素属性值的属性的当前范围。意思是:

如果您有一个名为的函数$scope.func1和一个定义为的元素:

<div myIsolatedFunc="func1">
Run Code Online (Sandbox Code Playgroud)

在另一个控制器的另一个路由中,函数类似于$scope.func2定义为的元素:

<div myIsolatedFunc="func2">
Run Code Online (Sandbox Code Playgroud)

您可以在指令中使用这两个函数:

app.directive('thedirective', function () {
  return {
    scope: {
      myIsolatedFunc: '='
    },
    link: function (scope, $element, attrs) {
      $scope.myIsolatedFunc(attrs.thedirective);
    }
  }
});
Run Code Online (Sandbox Code Playgroud)

更不用说不同的功能不需要有不同的名称。