创建一个可用于角度4模板的全局函数

Question

我想创建一个可以在角度模板中使用的可重用函数.我创建了一个函数:

 export function stringSplit(string : string, separator : string = '/') : any {
    return string.split(separator);
}

我试图像这样添加到模板中:

<p> stringSplit('hello/user') </p>

但我得到这个错误:

ERROR TypeError: _co.stringSplit is not a function

我不确定如何在角度中创建和使用全局函数.

我们可以角度执行此操作吗？

在这种情况下,最佳解决方案是什么？

Answer 1

答案是你不应该.依赖注入是Angular提供的一个功能强大的工具,其唯一目的是在不维护全局范围的情况下跨组件共享功能.你应该做的是创建一个服务,向它添加一个方法,将你的服务注入任何需要它的组件,然后在那里调用它.

从你的问题来看,有一个管道来执行你需要的操作会很好.管道用于操纵任何模板内的数据(使该功能对于属于属于模块的所有模板实际上是全局的,这些模块可以声明或导入管道).你可以这样写:

@Pipe({name: 'splitString'})
export class SplitString implements PipeTransform {
  transform(value: string, separator: string): string[] {
     return value.split(separator);   
  }
}

在你的HTML中:

<p>{{ myString | splitString : ',' }} </p>

了解更多关于管道在这里.