Angular 2个函数库
Angular 2 functions library
在我的应用程序中,我需要创建一个函数库以供不同组件访问。做这个的最好方式是什么?我是否需要提供具有所有功能或 class 或模块或组件的服务?
在这个库中,如果我从一个组件调用一个函数并且这个函数需要访问调用者中的一个变量,是否可以这样做?
如果它只是一组一次性的辅助函数,最简单的方法是使用您的辅助方法创建一个@Injectable 服务,然后将其注入到任何需要它们的组件中。您也可以提供 public 变量,以便在您的 html.
中访问它们
@Injectable()
export class Helpers {
helper1() { return "hello"; }
helper2(x) { return x + 1 }
}
@Component({
providers: [Helpers],
template: "<div>{{helper1()}}</div>" // will display 'hello'
)}
export class MyComponent {
public helper1: Function = Helpers.helper1;
constructor() {
console.log(Helpers.helper2(5)); // will output '6'
}
}
这对于一组简单的随机效用函数非常有效。如果您需要更深入的东西,请解释,我们可以提供替代解决方案。
在我的应用程序中,我需要创建一个函数库以供不同组件访问。做这个的最好方式是什么?我是否需要提供具有所有功能或 class 或模块或组件的服务?
在这个库中,如果我从一个组件调用一个函数并且这个函数需要访问调用者中的一个变量,是否可以这样做?
如果它只是一组一次性的辅助函数,最简单的方法是使用您的辅助方法创建一个@Injectable 服务,然后将其注入到任何需要它们的组件中。您也可以提供 public 变量,以便在您的 html.
中访问它们@Injectable()
export class Helpers {
helper1() { return "hello"; }
helper2(x) { return x + 1 }
}
@Component({
providers: [Helpers],
template: "<div>{{helper1()}}</div>" // will display 'hello'
)}
export class MyComponent {
public helper1: Function = Helpers.helper1;
constructor() {
console.log(Helpers.helper2(5)); // will output '6'
}
}
这对于一组简单的随机效用函数非常有效。如果您需要更深入的东西,请解释,我们可以提供替代解决方案。