我想在Angular中重用一个函数,它可以改变多个组件的属性(相同类型)。第一种解决方案是将此函数作为全局变量导入。
Utilis.ts
export function alterProperty(property: CustomProperty) {
.... // some change on property
}
component.ts
import {alterProperty} from './Utilis.ts'
class MyComponent {
property1: CustomProperty;
constructor(){}
handleClick() {
alterProperty(this.property1);
}
}
在我阅读了一些关于Angular Dependency Injection的文章之后,我意识到这可能不是一个好的解决方案,所以我想出了另一个解决方案。
myService.ts
@Injectable()
export class MyService1 {
constructor(){}
alterProperty(property: CustomProperty)
}
component.ts
import MyService1 from 'myService.ts'
@Component{
providers: [MyService1]
}
export class MyComponent {
property1: CustomProperty;
constructor(private service1:MyService1){}
handleClick(){
this.service1.alterProperty(this.property1);
}
}
这是我的问题:
这是在Angular中组织可重用函数的正确方法吗?
这是我在其他地方更改MyComponen的property1的正确方法(在此示例中,通过从myService Dependency调用alterProperty函数来更改property1)(它让我觉得我失去了对property1的控制) 。有没有更优雅的方法来解决它?
感谢任何建议。
答案 0 :(得分:0)
答案1.)您可以在src下的共享目录中拥有服务或实用程序。此服务中的功能将负责更改属性。
答案2.)AFAIK,拥有共享服务是一种有效的解决方案。只要需要,就会将其注入组件中。可能有更好的解决方案,但这个也不正确。