从控制器中的不同JS文件调用过滤器

Question

我有一个控制器驻留在名为EmployeeCtrl.js的单独文件中。在此控制器内部，我有一个名为convertJsonDate的过滤器，可将JsonResult date format转换为标准格式MM/dd/yyyy hh:mm:ss。

我现在的问题是，我怎样才能使这个过滤器在未来的不同控制器中可重用？我已经读过，你可以添加你的过滤器在一个单独的js文件filters.js并注入到你的控制器，但我不知道要实现这一点。

TIA

app.js

(function() { 
'use strict'; 

angular.module('app', []); 
})(); 

EmployeeCtrl.js

(function() { 
'use strict'; 

var app = angular.module('app'); 

app.filter('convertJsonDate', ['$filter', function ($filter) { 
    return function (input, format) { 
     return (input) ? $filter('date')(parseInt(input.substr(6)), format) : ''; 
    }; 
}]); 

app.controller('app.EmployeeController', ['$scope', 'app.EmployeeService', function ($scope, EmployeeService) { 

    GetAllEmployee(); 

    $scope.sortColumnBy = function (keyname) { 
     $scope.sortKey = keyname; 
     $scope.reverse = !$scope.reverse; 
    } 

    $scope.employee = { 
     employeeId: '', 
     firstName: '', 
     lastName: '', 
     password: '', 
     daysPerWeek: 0, 
     active: true, 
     departmentId: 0, 
     accountTypeId: 0 
    }; 

    $scope.clear = function() { 
     $scope.employee.employeeId = ''; 
     $scope.employee.firstName = ''; 
     $scope.employee.lastName = ''; 
     $scope.employee.password = ''; 
     $scope.employee.daysPerWeek = 0; 
     $scope.employee.active = false; 
     $scope.employee.departmentId = 0; 
     $scope.employee.accountTypeId = 0; 
    }; 

    function GetAllEmployee() { 
     var getEmployeeData = EmployeeService.getEmployees(); 

     getEmployeeData.then(function (employee) { 
      $scope.employees = employee.data; 
     }, function() { 
      alert('Error in getting employee records'); 
     }); 
    }; 
}]); 

})(); 

使用convertJsonDate滤波器

<div ng-app="app"> 
<div ng-controller="app.EmployeeController"> 
    ..... 
    <tbody> 
     <tr ng-repeat="e in employees | orderBy:sortKey:reverse | filter:searchKeyWord"> 
      <td>{{e.AccountDateExpired | convertJsonDate:'MM/dd/yyyy hh:mm:ss'}}</td> 
     </tr> 
    </tbody> 
    .... 
</div> 
</div> 

引擎收录

Index.chtml http://pastebin.com/aXDSmYAV

EmployeeCtrl.js http://pastebin.com/eQhRREPy

app.js http://pastebin.com/1GB4uhvx

Answer 1

不管它们是在同一个文件还是在不同的文件中。只要两者在同一个模块中，或者过滤器位于您的依赖项中包含的模块中，就可以使用它。

我建议有3个文件的位置：一个声明你的模块，一个是你的控制器（S），一个用于您的过滤器（S）：

module.js

var app = angular.module('app', []); 

filters.js

var app = angular.module('app'); 

app.filter('convertJsonDate', ['$filter', function ($filter) { 
    return function (input, format) { 
     return (input) ? $filter('date')(parseInt(input.substr(6)), format) : ''; 
    }; 
}]); 

controllers.js

var app = angular.module('app'); 

app.controller('app.EmployeeController', ['$scope', 'app.EmployeeService', function ($scope, EmployeeService) { 

    GetAllEmployee(); 

    $scope.sortColumnBy = function (keyname) { 
     $scope.sortKey = keyname; 
     $scope.reverse = !$scope.reverse; 
    } 

    $scope.employee = { 
     employeeId: '', 
     firstName: '', 
     lastName: '', 
     password: '', 
     daysPerWeek: 0, 
     active: true, 
     departmentId: 0, 
     accountTypeId: 0 
    }; 

    $scope.clear = function() { 
     $scope.employee.employeeId = ''; 
     $scope.employee.firstName = ''; 
     $scope.employee.lastName = ''; 
     $scope.employee.password = ''; 
     $scope.employee.daysPerWeek = 0; 
     $scope.employee.active = false; 
     $scope.employee.departmentId = 0; 
     $scope.employee.accountTypeId = 0; 
    }; 

    function GetAllEmployee() { 
     var getEmployeeData = EmployeeService.getEmployees(); 

     getEmployeeData.then(function (employee) { 
      $scope.employees = employee.data; 
     }, function() { 
      alert('Error in getting employee records'); 
     }); 
    }; 
}]); 

})(); 

Answer 2

他们可以，如果你使用的是相同的应用程序 ......这里被重用，

var app = angular.module('app'); 

你可以用同样的方法此过滤器使用的是它在电流控制器用于任何其他控制器这个程序

下