将匿名提供程序添加到用 TypeScript 编写的 Angular 模块

Question

是否可以将 .js 文件中的提供者（匿名）注入到使用打字稿编写的 angular 模块中？我正在尝试编译在模块定义中失败的打字稿。

故事

我有一个足够基本的模块，使用 angular 打字稿符号编写。我正在尝试将 adalAuthenticationService 提供商的定义添加到 adal-angular.js 的组合中。因为 provider 不是 .d.ts 格式，所以我无法将其用作参考。将 provider 转换为 .d.ts 目前是不可能的。所以我只剩下匿名注入选项（如果有这样的选项）。

控制器定义

module Temp.NewModule {
     interface IMainCtl {
         init(): void;
         b1(): void;
         b2(): void;
     }

     class MainCtl implements IMainCtl {
         hello: string;    
         txtb1: string;
         txtb2: string;

         // not sure what effect {private adalService: any} has as it doesn't seem to provide anonymity
         constructor(private $scope, private $log: ng.ILogService, private Api: IApi, private adalService: any) {
             var vm = this;
             this.init();
             // not sure if this actually does anything
             var adalService = adalAuthenticationService;
         }

         public init() {
             this.Api.getDataRx().subscribe((result) => {
                 this.hello = result.data.Name;
             });
         }

         public helloWorld() {
             this.$log.info('I accept your greeting');
         }

         public b1() {
            this.txtb1 = 'Now Button 1 works';
         }

         public b2() {
            // i am trying to call login function of adalService provider
            adalService.login();
         }
     }
     // i am trying to inject adalService provider here
     app.controller('MainCtl', ['$scope','$log','Api', MainCtl, adalService]);
 }

应用定义

module Temp {
    export module NewModule {
        export var serviceRoot: string = NewModule.serviceRoot || "";
        export var templatePath: string;
        export var servicesFramework: any;


        //Initalizes angular app
        $("html").attr("ng-app", "NewModule");
        export var app: ng.IModule = angular.module('NewModule', ['rx', 'ngRoute', 'AdalAngular'])
        .config(['$routeProvider', '$httpProvider', 'adalAuthenticationServiceProvider', function($routeProvider, $httpProvider, adalProvider) {
            adalProvider
            .init ({
                tenant: 'tenant.onmicrosoft.com',
                clientId: 'client_id',
                extraQueryParameter: 'nux=1',
                //cacheLocation: 'localStorage', // enable this for IE, as sessionStorage does not work for localhost.
            },
            $httpProvider
            );
        }]);

    }
}

基本上，我试图绕过编译阶段，将 adalAuthenticationService 作为依赖项注入，因为包含 adal-angular.js。所以理论上它应该在页面呈现后被拾取。

Answer 1

你的最后一行是错误的，你在你的控制器之后注入了 adalService。此外，根据 adal 文档，该服务称为 adalAuthenticationService。尝试类似的东西：

 app.controller('MainCtl', ['$scope','$log','Api', 'adalAuthenticationService', MainCtl]);

完全支持匿名注入，你甚至不需要指定任何一个。如果您不指定任何内容，它将被视为任何内容。如果您想利用 IntelliSense，您可以只在 adal.d.ts 文件中写入您需要的内容，而不必完成所有内容。

在你的 b2 函数中，你忘记了这个：

public b2() {
    // i am trying to call login function of adalService provider
    this.adalService.login();
}

将匿名提供程序添加到用 TypeScript 编写的 Angular 模块

Adding anonymous provider to Angular module written in TypeScript

c#

angularjs

typescript

adal