从angular2模板调用静态函数
我正在尝试为角项目构建“实用程序”服务(类).实用程序类具有静态函数(因此我们不必实例化不必要的对象).一个例子是:
import { Injectable } from '@angular/core'; @Injectable() export class DateService { constructor() { } public static parseDate(dateString: string): Date { if (dateString) { return new Date(dateString); } else { return null; } } } 在我的组件类文件中,然后我像这样导入它: import { DateService } from '../utilities/date.service'; 并且在这样的类代码中工作: ngOnInit():void { let temp = DateService.parseDate("2012/07/30"); console.log(temp); // Mon Jul 30 2012 00:00:00 GMT-0500 (Central Daylight Time) } 但是,我希望能够在角度html模板中使用这些实用程序功能,如下所示: <label for="date">Date</label> <input type="date" class="form-control" id="date" required [value]="event.date | date: 'yyyy-MM-dd'" (input)="event.date=DateService.parseDate($event.target.value)" name="date"> 不幸的是,这不起作用;给出了“无法读取属性’parseDate’的未定义”错误. 现在,我可以将’parseDate’函数移动到组件类,并且工作正常(当然,模板中需要更改)…但是,如果我有一堆组件,他们都需要有自己的’parseDate’功能,我想我们都知道这是一个不好扩展的坏主意. (请忽略parseDate函数的微不足道的性质) 此外,即使我不想实例化一个对象只是为了运行静态函数,我尝试使用实际的依赖注入.将它添加到providers数组,并在构造函数中构建实例 – 如下所示: constructor(private _dateService: DateService) { } 然后将我的模板更改为: label for="date">Date</label> <input type="date" class="form-control" id="date" required [value]="event.date | date: 'yyyy-MM-dd'" (input)="event.date=_dateService.parseDate($event.target.value)" name="date"> 这也失败了,这次带有“self.context._dateService.parseDate不是函数”错误.从函数中删除’static’可以解决问题,我可以继续前进,但是我仍然需要实例化一些东西才能运行应该只是一个静态函数.当然有更好的方法. 思考?
只能从视图中调用组件类的实例成员.
如果要调用静态成员,则需要在组件中提供getter. export class MyComponent { parseDate = DateService.parseDate; } 然后就可以使用它了 (input)="event.date=parseDate($event.target.value)" (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |