Можно ли назначить все импорты модулей в качестве возвращаемого типа?

Я новичок в Typescript (1.8). Я преобразовываю проект, написанный для angular 1.4, в машинописный текст.

Одной из вещей, которые я сделал, было создание D3Service, который асинхронно загружает библиотеку d3.js и делает ее доступной в промисе.

Это мой преобразованный код в машинописный текст:

namespace D3Provider{

    export class D3Service{
        static $inject = ['$document', '$window', '$q', '$rootScope','$timeout'];

        public d3: ng.IPromise<{}>;

        constructor(
            private $document: ng.IDocumentService, 
            private $window: ng.IWindowService, 
            private $q: ng.IQService, 
            private $rootScope: ng.IScope, 
            private $timeout: ng.ITimeoutService){
                var d = $q.defer();
                this.d3=d.promise;
                function onScriptLoad() {
                // Load client in the browser
                $timeout(function(){
                    $rootScope.$apply(function () {
                        d.resolve($window['d3']);
                    });
                });
            }
            var scriptTag = $window.document.createElement('script');
            scriptTag.type = 'text/javascript';
            scriptTag.async = true;
            scriptTag.charset="utf-8"
            scriptTag.src = 'bower_components/d3/d3.min.js';
            scriptTag.onload = onScriptLoad;

            var s = $document[0].getElementsByTagName('body')[0];
            s.appendChild(scriptTag);
        }
    }
    angular.module('d3', [])
    .service('d3Service', D3Service);
}

Общедоступное свойство d3 содержит обещание, содержащее значения из window.d3.

Я скачал файл, который доступен в ../../типы/модули/d3/index.d.ts

В коде я пробовал такие вещи, как:

/// <reference path="../../typings/modules/d3/index.d.ts" />

import * as d3lib from 'd3';
...
public d3: ng.IPromise<d3lib>;

Затем компилятор жалуется: ошибка TS2304: не удается найти имя «d3lib».


visual-studio-code typescript typescript-typings angularjs d3.js
person gadeynebram    schedule 11.10.2016    source источник
comment
почему бы не сделать ng.IPromise<d3> без импорта?   -  person Paarth    schedule 11.10.2016
comment
Кроме того, пробовали ли вы использовать этот файл?   -  person Paarth    schedule 11.10.2016
comment
Привет @Paarth, Может быть, я делаю что-то не так, но когда я просто использую ссылку без импорта и говорю ng.IPromise‹d3›, я получаю сообщение об ошибке Не удается найти имя 'd3'. Когда я использую другой файл, я получаю ту же ошибку.   -  person gadeynebram    schedule 11.10.2016
comment
Я должен был уточнить. Когда вы пытались это сделать, вы удалили строку import *, но оставили строку /// <reference path? Это было мое предложение   -  person Paarth    schedule 11.10.2016
comment
Да, это дает тот же результат. Что я также вижу в файле d3.d.ts, так это то, что он указывает строку export = d3 как повторяющийся идентификатор export =   -  person gadeynebram    schedule 11.10.2016
comment
Ваш tsconfig уже включает файл типов?   -  person Paarth    schedule 11.10.2016
comment
tsconfig.json содержит только параметры компилятора. В каталоге typings есть файл index.d.ts, в котором я изменил d3 index.d.ts на новый файл d3.d.ts.   -  person gadeynebram    schedule 11.10.2016
comment
В качестве альтернативы вы можете сделать свое обещание недействительным (назовите его d3Ready или что-то в этом роде), и когда оно будет разрешено, вы можете получить доступ к d3 как к глобальной переменной/пространству имен.   -  person Aleksey L.    schedule 11.10.2016
comment
@Paarth Я добавил исключающую часть в файл tsconfig.   -  person gadeynebram    schedule 11.10.2016
comment
@АлексейЛ. Не могли бы вы привести пример того, как это можно сделать?   -  person gadeynebram    schedule 11.10.2016

Ответы (1)


arrow_upward
1
arrow_downward

В качестве альтернативы вы можете сделать свое обещание недействительным (назовите его ready или что-то в этом роде), и когда оно будет разрешено, вы сможете получить доступ к d3 как к глобальной переменной/пространству имен.

public ready: ng.IPromise<void>;

...

var d = $q.defer();
this.ready = d.promise;
var scriptTag = $window.document.createElement('script');
scriptTag.type = 'text/javascript';
scriptTag.async = true;
scriptTag.charset="utf-8"
scriptTag.src = 'bower_components/d3/d3.min.js';
scriptTag.onload = () => d.resolve();
var s = $document[0].getElementsByTagName('body')[0];
s.appendChild(scriptTag);

Затем вы можете использовать его:

d3Service.ready.then(() => {
   //d3 can be used here 
});

Также не нужны $timeout и $scope.$apply

person Aleksey L.    schedule 11.10.2016