Question

Angular从服务中获取一些JSON作为路由解析的一部分。

JSON作为Angular-ish反序列化对象注入控制器。

对象的属性与提供的TypeScript类对齐，因此{h}页面上已成功显示vm.foo.displayName。

但我认为TypeScript类中定义的方法无处可寻，所以当我尝试调用vm.foo.run()时，控制台会输出错误： TypeError：Object不支持属性或方法'跑'

module app.Samples {

    export class Foo {
        public typeName: string;
        public displayName: string;

        public run(): void {
            alert("Running!");
        }
    }
}

module app.Samples {

     interface IFoobarScope {
         foo: Foo;
     }

     class FoobarController implements IFoobarScope {
         foo: Foo;

         static $inject = ['foo'];
         constructor(foo: Foo) {
             var vm = this;
             vm.foo = foo;
             vm.foo.run();
         }
     }

     angular
         .module('app.Samples')
         .controller('app.Samples.FoobarController', FoobarController);
 }

Answer 1

是的，就AngularJS而言，它只是将任何旧对象传递到控制器功能中。 TypeScript为您的代码中的Foo类提供了语法糖，但如果它没有run()方法，它就不会给对象提供。

您可以为Foo类型创建一个复制构造函数：

constructor(foo?: Foo) {
    if(foo) {
        this.typeName = foo.typeName;
        this.displayName = foo.displayName;
    }
}

然后在您的控制器中执行此操作：

constructor(foo: Foo) {
    var vm = this;
    vm.foo = new Foo(foo);
    vm.foo.run();
}

或者，您可以跳过复制构造函数方法并使用angular.extend()：

constructor(foo: Foo) {
    var vm = this;
    vm.foo = new Foo();
    angular.extend(vm.foo, foo);
    vm.foo.run();
}

将AngularJS对象注入TypeScript类（缺少方法）

1 个答案: