![testController]( "testController")
请原谅下面的代码墙，但是每个块只有一个小更改，并且每个更改都被注释。我正试图使用“角+”的“控制器”作为模板，附带的是模板包。这就是模板开箱即用的样子。我对模板所做的唯一修改是注释、空白，并将“APP1”重命名为“应用程序”：interface ItestControllerScope extends ng.IScope { vm: testController;}interface ItestController { greeting: string; controllerId: string; //This won't work... changeGreeting: () => void;}class testController implements ItestController { static controllerId: string = "testController"; //...because this is static. greeting = "Hello"; constructor(private $scope: ItestControllerScope, private $http: ng.IHttpService, private $resource: ng.resource.IResourceService) { } changeGreeting() { this.greeting = "Bye"; }}app.controller(testController.controllerId, ['$scope', '$http', '$resource', ($scope, $http, $resource) => new testController($scope, $http, $resource) ]);首先要注意的是，由于Controller类的静态controllerId成员和controllerId接口所要求的Icontroller成员，它甚至不会编译。因为接口的成员需要在类类型的实例端实现，所以这不起作用。这很烦人，但很容易相处，尽管这样做会使我们失去一些类型检查：interface ItestControllerScope extends ng.IScope { vm: testController;}interface ItestController { greeting: string; changeGreeting: () => void;}class testController implements ItestController { //we leave the static member on the class and remove the member //from the interface static controllerId: string = "testController"; greeting = "Hello"; constructor(private $scope: ItestControllerScope, private $http: ng.IHttpService, private $resource: ng.resource.IResourceService) { } changeGreeting() { this.greeting = "Bye"; }}app.controller(testController.controllerId, ['$scope', '$http', '$resource', ($scope, $http, $resource) => new testController($scope, $http, $resource) ]);现在这编译了，但问题是如何将调用 >被翻译成JavaScript。它不是直接将构造函数传递给app.controller()，而是包装在一个匿名函数中，我们最终得到的是构造函数中的构造函数：var testController = (function () { function testController($scope, $http, $resource) { this.$scope = $scope; this.$http = $http; this.$resource = $resource; this.greeting = "Hello"; } testController.prototype.changeGreeting = function () { this.greeting = "Bye"; }; testController.controllerId = "testController"; return testController;})();app.controller(testController.controllerId, ['$scope', '$http', '$resource', //Why won't this work? Why would we want to do this in the first place? function ($scope, $http, $resource) { return new testController($scope, $http, $resource); }]);现在，当我们试图在视图中使用“控制器AS”语法时，角度不能找到混叠的控制器——视图绑定到空对象。据我所知，typescript模板应该如下所示：interface ItestControllerScope extends ng.IScope { vm: testController;}interface ItestController { greeting: string; changeGreeting: () => void;}class testController implements ItestController { static controllerId: string = "testController"; greeting = "Hello"; constructor(private $scope: ItestControllerScope, private $http: ng.IHttpService, private $resource: ng.resource.IResourceService) { } changeGreeting() { this.greeting = "Bye"; }}//Now we're passing the controller constructor directly instead of//wrapping the constructor call in another constructorapp.controller(testController.controllerId, ['$scope', '$http', '$resource',testController]);它编译成这个JavaScript：var testController = (function () { function testController($scope, $http, $resource) { this.$scope = $scope; this.$http = $http; this.$resource = $resource; this.greeting = "Hello"; } testController.prototype.changeGreeting = function () { this.greeting = "Bye"; }; testController.controllerId = "testController"; return testController;})();app.controller(testController.controllerId, ['$scope', '$http', '$resource', testController]);效果很好。所以我有两个主要问题：为什么要将控制器构造函数封装在lambda中，而不是直接传递构造函数呢？为什么模板在类上有一个静态成员，它试图在类实现的接口上强制执行一个成员？我唯一的猜测是，这两个问题在早期的typescript和angular版本的组合中都不是问题，但我不知道，因为我对这两个版本都相当陌生。我用的是TypeScriptv1.4和Angularv1.3.14 (adsbygoogle = window.adsbygoogle || []).push({}); 最佳答案 为什么要将控制器构造函数包装在lambda中，以传递给angular的controller（）方法，而不是直接传递构造函数？你不会的。我不https://www.youtube.com/watch?v=WdtVn_8K17E为什么模板在类上有一个静态成员，它试图用该类实现的接口上的一个成员强制该静态成员关于controllerId: string; //This won't work...在接口上有一个成员并用类实现该接口意味着类的实例将有这个成员。不过，你想说的是，这个类有这个成员。这不能通过实现接口来实现。您可以通过其他方式确保：var mustHaveId:{controllerId:string};class Fail{}class Pass{static controllerId = "Pass"}mustHaveId = Fail; // ErrormustHaveId = Pass; // Pass关于angularjs - Typescript + Angular“controller as” Sidewaffle模板无法立即使用，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/28861916/ (adsbygoogle = window.adsbygoogle || []).push({}); 10-09 15:37