包括角应用中的自定义过滤器

Question

我想使用一些自定义过滤器从我的角度应用程序的html中的某些特定于URL的文本中删除空格，我想我可以创建一个过滤器文件并从主“angular-app.js”中需要这个。

首先，我创建了一个新的js：filters.browser.js，仅包含：

angular.module('customFilters', []).
filter('nospace', function () {
  return function (value) {
    return (!value) ? '' : value.replace(/ /g, '');
  };
});

我希望能够使用此文件，所以我添加了 'customFilters'到app模块注入，下面是我的完整“angular-app.js”：

/* jslint node: true */
'use strict';
var di = require('di');
var angular = require('angular');
require('angular-resource');
require('angular-route');
require('bootstrap');
require('angular-bootstrap');

var app = angular.module('developdavid', [
    'ngRoute',
    'ui.bootstrap',
    'ngResource',
    'customFilters'
    ]);
app.config(function ($routeProvider) {
  //$routeProvider.otherwise({redirectTo : '/home'});
});

var uiModules = {
  angular   : [ 'value', angular ],
  app       : [ 'value', app ]
};
uiModules.uiModules = [ 'value', uiModules ];

var injector = new di.Injector([uiModules]);

/* modules browserify */

我想使用过滤器的partial.jade文件包含：

      a(href='/#/readPost/{{post.title | nospace}}') More

使用此设置但是我在开发者控制台中收到“未捕获的对象”错误。

我是否需要向filters.js添加更多内容？

我想将过滤器与代码库的其余部分分开。

我的种子还有以下文件：browser-requires.js包含：

/* jslint node: true */
'use strict';
var fs            = require('fs');

module.exports = function () {
  var requires = [];
  fs.readdirSync('./sections/').forEach(function (file) {
    var fullpath    = './sections/' + file,
        isDirectory = fs.lstatSync(fullpath).isDirectory();
    if (isDirectory && file !== '_default') {
      var dir = file;
      fs.readdirSync('./sections/' + dir).forEach(function (file) {
        if (/.*\.browser.js$/.test(file)) {
          requires.push('injector.invoke(require(\'../' + dir + '/' + file + '\'));');
        }
      });
    }
  });
  return requires.join('');
};

也许我需要在grunt文件中添加一些内容以在minized js中包含filters.js？

/* jslint node: true */
'use strict';
module.exports = function (grunt) {

  var transformify = require('transformify');
  var requires = require('./sections/_default/browser-requires.js')();


  var addRequires = transformify(function (x) {
    return x.replace('/* modules browserify */', requires);
  });
    // Project configuration.
  grunt.initConfig({
    pkg     : grunt.file.readJSON('package.json'),
    jshint  : {
      all     : [ 'Gruntfile.js', 'index.js', 'sections/**/*.js' ]
    },
    browserify: {
      dist: {
        files: {
          'static/js/app.js': ['sections/_default/angular-app.js']
        },
        options: {
          transform: [ addRequires, 'browserify-shim']
        }
      }
    },
    uglify  : {
      target : {
        files : { 'static/js/app.min.js' : 'static/js/app.js' }
      },
      options: {
        mangle: false
      }
    },
    clean : [ 'static/js/app.js' ]
  });

  grunt.loadNpmTasks('grunt-browserify');
  grunt.loadNpmTasks('grunt-contrib-jshint');
  grunt.loadNpmTasks('grunt-contrib-uglify');
  grunt.loadNpmTasks('grunt-contrib-clean');


    // Default task(s).
  grunt.registerTask('default', [
      'jshint',
      'browserify',
      'uglify',
      'clean'
    ]
  );

};