javascript - 如何使用 typescript 声明(.ts.d 文件)在 Angular cli 应用程序中使用第三方 javascript API/SDK？

标签 javascript angular typescript dropbox-api

我想在我的 angular cli 项目中使用 Dropbox API，它是一个 javascript API。 API 附带 Typescript 定义。这是 dist 文件夹的样子。 enter image description here

他们有一个示例函数，该函数返回在 .ts 文件和 .js 文件中编写的文件列表: 这是返回文件列表的 basic.js 和 basic.ts: 基本.js: enter image description here

和basic.ts: enter image description here 这是脚本运行的 html 文件以供引用:

<!doctype html>
<html>
<head>
  <title>Dropbox TypeScript SDK</title>
  <link rel="stylesheet" href="/styles.css">
  <script src="/__build__/Dropbox-sdk.min.js"></script>
</head>
<body>
  <!-- Example layout boilerplate -->
  <header class="page-header">
    <div class="container">
      <nav>
        <a href="/">
          <h1>
            <img src="https://cfl.dropboxstatic.com/static/images/brand/logotype_white-vflRG5Zd8.svg" class="logo" />
            TypeScript SDK Examples
          </h1>
        </a>
        <a href="https://github.com/dropbox/dropbox-sdk-js/tree/master/examples/typescript" class="view-source">View Source</a>
      </nav>
      <h2 class="code">
        <a href="/">examples</a> / basic
      </h2>
    </div>
  </header>

  <!-- Example description and UI -->
  <section class="container main">
    <p>This example fetches the contents of your root Dropbox directory. It uses the <code>Dropbox.filesListFolder()</code> method [<a href="http://dropbox.github.io/dropbox-sdk-js/Dropbox.html#filesListFolder">docs</a>].</p>

    <form onSubmit="return listFiles()">
      <input type="text" id="access-token" placeholder="Access token" />
      <button type="submit">Submit</button>
    </form>

    <!-- The files returned from the SDK will be added here -->
    <ul id="files"></ul>

    <p class="info">To obtain an access token for quick testing, you can go to <a href="https://dropbox.github.io/dropbox-api-v2-explorer/#files_list_folder" target="_blank">API Explorer</a> click the "Get Token" button on the top right, copy the token it creates and then paste it here.</p>
  </section>

  <!-- Scripts to run example -->
  <script src="basic.js"></script>
</body>
</html>

如何使用此 API？我安装了 npm，但如何使用 .d.ts 文件？我应该为我的 Angular 项目使用 .ts 还是 .js 代码？我想在我的一个 typescript 组件中使用 api 吗？我不知道如何在我的 Angular 组件中包含定义和使用这些定义。我假设我包含 Dropbox-sdk.min.js 是我在 angular-cli.json 中的脚本，但是我在哪里或如何包含 .d.ts 文件，哪些是必需的？我在 dropbox github 上没有找到相关文档。 github 包含 typescript 和 javascript 使用的完整工作示例，但它是一个令人困惑的项目，因为它似乎将许多不同的东西混合到项目中，我不知道如何将它翻译成 angular-cli 应用程序 https://github.com/dropbox/dropbox-sdk-js 如果我还应该在问题中包含其他内容，请告诉我!

最佳答案

我本来想说你应该能够像顶部的任何其他 Angular 接口(interface)一样导入它们，然后在你的组件中引用它们，但是看看他们的 repo 如何生成他们的类型看起来有点奇怪。几乎就像他们在声明使用生成器动态构建类型的模块一样。我对此一无所知。您总是可以尝试删除围绕此 Dropbox 类的模块包装器 - https://github.com/dropbox/dropbox-sdk-js/blob/master/generator/typescript/dropbox.d.ts

然后在第二行的 Dropbox 类定义之前添加“export”？

这里就像是去掉了所有的评论。

编辑 - 看起来您需要对这个文件、基类和接口(interface)执行相同的操作。 https://github.com/dropbox/dropbox-sdk-js/edit/master/generator/typescript/dropbox_types.d.ts导出接口(interface)和类并删除模块行。

然后您应该能够创建一个 index.ts 文件，从这两个文件中导出所有语句。

我觉得这不是正确的方法....但我不明白为什么它行不通。

export class Dropbox extends DropboxBase {

constructor(options: DropboxOptions);


public authTokenFromOauth1(arg: auth.TokenFromOAuth1Arg): Promise<auth.TokenFromOAuth1Result>;

public authTokenRevoke(arg: void): Promise<void>;

public filesAlphaGetMetadata(arg: files.AlphaGetMetadataArg): Promise<files.FileMetadataReference|files.FolderMetadataReference|files.DeletedMetadataReference>;

public filesAlphaUpload(arg: files.CommitInfoWithProperties): Promise<files.FileMetadata>;

public filesCopy(arg: files.RelocationArg): Promise<files.FileMetadataReference|files.FolderMetadataReference|files.DeletedMetadataReference>;

public filesCopyBatch(arg: files.RelocationBatchArg): Promise<files.RelocationBatchLaunch>;


public filesCopyBatchCheck(arg: async.PollArg): Promise<files.RelocationBatchJobStatus>;


public filesCopyReferenceGet(arg: files.GetCopyReferenceArg): Promise<files.GetCopyReferenceResult>;

public filesCopyReferenceSave(arg: files.SaveCopyReferenceArg): Promise<files.SaveCopyReferenceResult>;


public filesCopyV2(arg: files.RelocationArg): Promise<files.RelocationResult>;


public filesCreateFolder(arg: files.CreateFolderArg): Promise<files.FolderMetadata>;

public filesCreateFolderV2(arg: files.CreateFolderArg): Promise<files.CreateFolderResult>;


public filesDelete(arg: files.DeleteArg): Promise<files.FileMetadataReference|files.FolderMetadataReference|files.DeletedMetadataReference>;

public filesDeleteBatch(arg: files.DeleteBatchArg): Promise<files.DeleteBatchLaunch>;

public filesDeleteBatchCheck(arg: async.PollArg): Promise<files.DeleteBatchJobStatus>;

public filesDeleteV2(arg: files.DeleteArg): Promise<files.DeleteResult>;

public filesDownload(arg: files.DownloadArg): Promise<files.FileMetadata>;

public filesGetMetadata(arg: files.GetMetadataArg): Promise<files.FileMetadataReference|files.FolderMetadataReference|files.DeletedMetadataReference>;

public filesGetPreview(arg: files.PreviewArg): Promise<files.FileMetadata>;

public filesGetTemporaryLink(arg: files.GetTemporaryLinkArg): Promise<files.GetTemporaryLinkResult>;

public filesGetThumbnail(arg: files.ThumbnailArg): Promise<files.FileMetadata>;

public filesListFolder(arg: files.ListFolderArg): Promise<files.ListFolderResult>;

public filesListFolderContinue(arg: files.ListFolderContinueArg): Promise<files.ListFolderResult>;

public filesListFolderGetLatestCursor(arg: files.ListFolderArg): Promise<files.ListFolderGetLatestCursorResult>;

public filesListFolderLongpoll(arg: files.ListFolderLongpollArg): Promise<files.ListFolderLongpollResult>;

public filesListRevisions(arg: files.ListRevisionsArg): Promise<files.ListRevisionsResult>;

public filesMove(arg: files.RelocationArg): Promise<files.FileMetadataReference|files.FolderMetadataReference|files.DeletedMetadataReference>;

public filesMoveBatch(arg: files.RelocationBatchArg): Promise<files.RelocationBatchLaunch>;

public filesMoveBatchCheck(arg: async.PollArg): Promise<files.RelocationBatchJobStatus>;

public filesMoveV2(arg: files.RelocationArg): Promise<files.RelocationResult>;

public filesPermanentlyDelete(arg: files.DeleteArg): Promise<void>;

public filesPropertiesAdd(arg: files.PropertyGroupWithPath): Promise<void>;

public filesPropertiesOverwrite(arg: files.PropertyGroupWithPath): Promise<void>;

public filesPropertiesRemove(arg: files.RemovePropertiesArg): Promise<void>;

public filesPropertiesTemplateGet(arg: properties.GetPropertyTemplateArg): Promise<properties.GetPropertyTemplateResult>;

public filesPropertiesTemplateList(arg: void): Promise<properties.ListPropertyTemplateIds>;

public filesPropertiesUpdate(arg: files.UpdatePropertyGroupArg): Promise<void>;

public filesRestore(arg: files.RestoreArg): Promise<files.FileMetadata>;

public filesSaveUrl(arg: files.SaveUrlArg): Promise<files.SaveUrlResult>;

public filesSaveUrlCheckJobStatus(arg: async.PollArg): Promise<files.SaveUrlJobStatus>;

public filesSearch(arg: files.SearchArg): Promise<files.SearchResult>;

public filesUpload(arg: files.CommitInfo): Promise<files.FileMetadata>;

public filesUploadSessionAppend(arg: files.UploadSessionCursor): Promise<void>;

public filesUploadSessionAppendV2(arg: files.UploadSessionAppendArg): Promise<void>;

public filesUploadSessionFinish(arg: files.UploadSessionFinishArg): Promise<files.FileMetadata>;

public filesUploadSessionFinishBatch(arg: files.UploadSessionFinishBatchArg): Promise<files.UploadSessionFinishBatchLaunch>;

public filesUploadSessionFinishBatchCheck(arg: async.PollArg): Promise<files.UploadSessionFinishBatchJobStatus>;

public filesUploadSessionStart(arg: files.UploadSessionStartArg): Promise<files.UploadSessionStartResult>;

public paperDocsArchive(arg: paper.RefPaperDoc): Promise<void>;

public paperDocsDownload(arg: paper.PaperDocExport): Promise<paper.PaperDocExportResult>;

public paperDocsFolderUsersList(arg: paper.ListUsersOnFolderArgs): Promise<paper.ListUsersOnFolderResponse>;

public paperDocsFolderUsersListContinue(arg: paper.ListUsersOnFolderContinueArgs): Promise<paper.ListUsersOnFolderResponse>;

public paperDocsGetFolderInfo(arg: paper.RefPaperDoc): Promise<paper.FoldersContainingPaperDoc>;

public paperDocsList(arg: paper.ListPaperDocsArgs): Promise<paper.ListPaperDocsResponse>;

public paperDocsListContinue(arg: paper.ListPaperDocsContinueArgs): Promise<paper.ListPaperDocsResponse>;

public paperDocsPermanentlyDelete(arg: paper.RefPaperDoc): Promise<void>;

public paperDocsSharingPolicyGet(arg: paper.RefPaperDoc): Promise<paper.SharingPolicy>;

public paperDocsSharingPolicySet(arg: paper.PaperDocSharingPolicy): Promise<void>;

public paperDocsUsersAdd(arg: paper.AddPaperDocUser): Promise<Array<paper.AddPaperDocUserMemberResult>>;

public paperDocsUsersList(arg: paper.ListUsersOnPaperDocArgs): Promise<paper.ListUsersOnPaperDocResponse>;

public paperDocsUsersListContinue(arg: paper.ListUsersOnPaperDocContinueArgs): Promise<paper.ListUsersOnPaperDocResponse>;

public paperDocsUsersRemove(arg: paper.RemovePaperDocUser): Promise<void>;

public sharingAddFileMember(arg: sharing.AddFileMemberArgs): Promise<Array<sharing.FileMemberActionResult>>;

public sharingAddFolderMember(arg: sharing.AddFolderMemberArg): Promise<void>;

public sharingChangeFileMemberAccess(arg: sharing.ChangeFileMemberAccessArgs): Promise<sharing.FileMemberActionResult>;

public sharingCheckJobStatus(arg: async.PollArg): Promise<sharing.JobStatus>;

public sharingCheckRemoveMemberJobStatus(arg: async.PollArg): Promise<sharing.RemoveMemberJobStatus>;

public sharingCheckShareJobStatus(arg: async.PollArg): Promise<sharing.ShareFolderJobStatus>;

public sharingCreateSharedLink(arg: sharing.CreateSharedLinkArg): Promise<sharing.PathLinkMetadata>;

public sharingCreateSharedLinkWithSettings(arg: sharing.CreateSharedLinkWithSettingsArg): Promise<sharing.FileLinkMetadataReference|sharing.FolderLinkMetadataReference|sharing.SharedLinkMetadataReference>;

public sharingGetFileMetadata(arg: sharing.GetFileMetadataArg): Promise<sharing.SharedFileMetadata>;

public sharingGetFileMetadataBatch(arg: sharing.GetFileMetadataBatchArg): Promise<Array<sharing.GetFileMetadataBatchResult>>;

public sharingGetFolderMetadata(arg: sharing.GetMetadataArgs): Promise<sharing.SharedFolderMetadata>;

public sharingGetSharedLinkFile(arg: sharing.GetSharedLinkFileArg): Promise<sharing.FileLinkMetadataReference|sharing.FolderLinkMetadataReference|sharing.SharedLinkMetadataReference>;

public sharingGetSharedLinkMetadata(arg: sharing.GetSharedLinkMetadataArg): Promise<sharing.FileLinkMetadataReference|sharing.FolderLinkMetadataReference|sharing.SharedLinkMetadataReference>;

public sharingGetSharedLinks(arg: sharing.GetSharedLinksArg): Promise<sharing.GetSharedLinksResult>;

public sharingListFileMembers(arg: sharing.ListFileMembersArg): Promise<sharing.SharedFileMembers>;

public sharingListFileMembersBatch(arg: sharing.ListFileMembersBatchArg): Promise<Array<sharing.ListFileMembersBatchResult>>;

public sharingListFileMembersContinue(arg: sharing.ListFileMembersContinueArg): Promise<sharing.SharedFileMembers>;

public sharingListFolderMembers(arg: sharing.ListFolderMembersArgs): Promise<sharing.SharedFolderMembers>;

public sharingListFolderMembersContinue(arg: sharing.ListFolderMembersContinueArg): Promise<sharing.SharedFolderMembers>;

public sharingListFolders(arg: sharing.ListFoldersArgs): Promise<sharing.ListFoldersResult>;

public sharingListFoldersContinue(arg: sharing.ListFoldersContinueArg): Promise<sharing.ListFoldersResult>;

public sharingListMountableFolders(arg: sharing.ListFoldersArgs): Promise<sharing.ListFoldersResult>;

public sharingListMountableFoldersContinue(arg: sharing.ListFoldersContinueArg): Promise<sharing.ListFoldersResult>;

public sharingListReceivedFiles(arg: sharing.ListFilesArg): Promise<sharing.ListFilesResult>;

public sharingListReceivedFilesContinue(arg: sharing.ListFilesContinueArg): Promise<sharing.ListFilesResult>;

public sharingListSharedLinks(arg: sharing.ListSharedLinksArg): Promise<sharing.ListSharedLinksResult>;

public sharingModifySharedLinkSettings(arg: sharing.ModifySharedLinkSettingsArgs): Promise<sharing.FileLinkMetadataReference|sharing.FolderLinkMetadataReference|sharing.SharedLinkMetadataReference>;

public sharingMountFolder(arg: sharing.MountFolderArg): Promise<sharing.SharedFolderMetadata>;

public sharingRelinquishFileMembership(arg: sharing.RelinquishFileMembershipArg): Promise<void>;

public sharingRelinquishFolderMembership(arg: sharing.RelinquishFolderMembershipArg): Promise<async.LaunchEmptyResult>;

public sharingRemoveFileMember(arg: sharing.RemoveFileMemberArg): Promise<sharing.FileMemberActionIndividualResult>;

public sharingRemoveFileMember2(arg: sharing.RemoveFileMemberArg): Promise<sharing.FileMemberRemoveActionResult>;

public sharingRemoveFolderMember(arg: sharing.RemoveFolderMemberArg): Promise<async.LaunchResultBase>;

public sharingRevokeSharedLink(arg: sharing.RevokeSharedLinkArg): Promise<void>;

public sharingShareFolder(arg: sharing.ShareFolderArg): Promise<sharing.ShareFolderLaunch>;

public sharingTransferFolder(arg: sharing.TransferFolderArg): Promise<void>;

public sharingUnmountFolder(arg: sharing.UnmountFolderArg): Promise<void>;

public sharingUnshareFile(arg: sharing.UnshareFileArg): Promise<void>;

public sharingUnshareFolder(arg: sharing.UnshareFolderArg): Promise<async.LaunchEmptyResult>;

public sharingUpdateFileMember(arg: sharing.UpdateFileMemberArgs): Promise<sharing.MemberAccessLevelResult>;

public sharingUpdateFolderMember(arg: sharing.UpdateFolderMemberArg): Promise<sharing.MemberAccessLevelResult>;

public sharingUpdateFolderPolicy(arg: sharing.UpdateFolderPolicyArg): Promise<sharing.SharedFolderMetadata>;

public teamLogGetEvents(arg: team_log.GetTeamEventsArg): Promise<team_log.GetTeamEventsResult>;

public teamLogGetEventsContinue(arg: team_log.GetTeamEventsContinueArg): Promise<team_log.GetTeamEventsResult>;

public usersGetAccount(arg: users.GetAccountArg): Promise<users.BasicAccount>;

public usersGetAccountBatch(arg: users.GetAccountBatchArg): Promise<users.GetAccountBatchResult>;

public usersGetCurrentAccount(arg: void): Promise<users.FullAccount>;

public usersGetSpaceUsage(arg: void): Promise<users.SpaceUsage>;
}

关于javascript - 如何使用 typescript 声明(.ts.d 文件)在 Angular cli 应用程序中使用第三方 javascript API/SDK？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45843781/

上一篇：javascript - 评估类构造函数中的参数

下一篇：angular - 在 Angular 应用程序中包含 hls.js 库

相关文章：

angular - 如何从 Kendo UI 网格导出所有当前数据？

javascript - 分配和修改数组之间的区别

javascript - 如何在 Angular 中使用通过状态传递的数据

typescript - <promise void> typescript

javascript - 如何使用 Gamepad API 检测按钮按下情况？

javascript - Backbone 应用程序未定义错误

javascript - 是否有任何好的 Node 模块连接谷歌缩短器 API 以缩短长 URL

javascript - 使用 JavaScript Promise 从 Firebase 云函数读取 Google Sheets

typescript - 基于接口(interface)的类型检查类引用

typescript - TypeScript 有像 Kotlin 这样的扩展吗？

©2024 IT工具网  联系我们