Typescript + angularjs 自定义过滤器未知提供者：答案

【问题标题】：Typescript + angularjs custome filter Unknown provider:Typescript + angularjs 自定义过滤器未知提供者：
【发布时间】：2013-08-19 10:44:38
【问题描述】：

我想创建一个自定义过滤器在 angularjs 中使用打字稿我的代码

//Reverse.ts
class Reverse{
    static filter(msg:string) {
        return (msg) => {
            return msg.split("").reverse().join("");
        }
    }
}


//app.ts
/// <reference path="../lib/angular.d.ts"/>
/// <reference path="./Reverse.ts"/>
class MyApp{
    public app:AngularModule;
    constructor(){
          this.app = angular.module('myApp', []);
          this.app.filter ('reverse',(msg) => { return Reverse.filter(msg) });
    }
}
class AlbumController {
    constructor (private $scope) {
        this.$scope.test = '20 whatsomething';
     }
}


new MyApp();

//index.html
<!DOCTYPE html>
<html>
    <head>
        <title>My test TS</title>
    </head>
    <body>
    <div data-ng-app="myApp">
        <div data-ng-controller="AlbumController">  
            {{test | reverse}}
        </div>
    </div>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
    <script src="./Reverse.js"></script>
    <script src="./app.js"></script>
    </body>
</html>

我收到错误：未知提供程序：msgProvider

更新

我解决了

class MyApp{
    public app:AngularModule;
    constructor(){
          this.app = angular.module('myApp', []);
          this.app.filter ('reverse',() => { 
            return (msg) => {
                return Reverse.filter(msg);
            } 
          });
    }
}
class AlbumController {
    constructor (private $scope) {
        this.$scope.test = '20 whatsomething';
     }
}


new MyApp();


class Reverse{
    static filter(msg:string) {
        return msg.split("").reverse().join("");
    }
}

同样感谢

【问题讨论】：

您是否使用 reverseFilter 模块初始化了您的应用程序？
@BKM 我更新了我解决了。Thx

标签： javascript angularjs typescript

【解决方案1】：

如果您使用 --out 编译器标志进行编译，您的原始代码将可以工作：

tsc --out app.js app.ts

PS：我做了一个关于 typescript + angularjs 工作流程的视频：http://youtube.com/watch?v=0-6vT7xgE4Y&hd=1

【讨论】：