javascript - 如何使用 Typescript 在 Ember App 中注入服务

Question

我正在关注本指南： https ://v4.chriskrycho.com/2018/typing-your-ember-update-part-1.html

这里我有一个服务，它只有一个函数 findAllContacts：

export default class ContactPicker extends Service {
  findAllContacts(): Promise<Contact[]> {
    return Promise.resolve(getContact());
  }
}

declare module '@ember/service' {
  interface Registry {
    'contact-picker': ContactPicker;
  }
}

和电话簿组件：

import Component from '@ember/component';
import Computed from "@ember/object/computed";
import ContactPicker from '../services/contact-picker';
import { inject as service } from '@ember/service';
export default class PhonebookView extends Component {
  contactPicker: Computed<ContactPicker> = service('contact-picker');

  didInsertElement() {
    let contacts = this.contactPicker.findAllContacts(); //error
  }
};

但是在调用 this.contactPicker.findAllContacts() 时出现打字稿错误： “ComputedProperty”.ts(2339) 类型上不存在属性“findAllContacts”

如何使用 Typescript 注入服务？

标签： javascripttypescriptember.js

Answer 1

尝试：

import Component from '@ember/component';
import ContactPicker from '../services/contact-picker';
import { inject as service } from '@ember/service';

export default class PhonebookView extends Component {
  @service declare contactPicker: ContactPicker;

  didInsertElement() {
    let contacts = this.contactPicker.findAllContacts(); //error
  }
};