Question

我一直在使用TypeScript和Angular半年。当我需要在$ scope中添加一些东西时，我遵循IMHO最佳实践来定义这样的界面：

interface IMyScope extends ng.ISCope { 
    myAddedProp:string;
}

...

link:($scope:IMyScope ){
    $scope.myAddedProp = "foo";
}

但是，有时候动态添加属性仍然很方便（主要是在我进行原型设计时）。对于那些情况，我通常做这样的事情：

link:($scope:IScope ){

    (<any>$scope).myAddedProp = "foo";

    //or
    $scope["myAddedProp"] = "foo";

    //If I have to add many props, I use this:
    var $scopeA: any = $scope;
    $scopeA.myAddedProp1 = "foo";
    $scopeA.myAddedProp2 = "bar";
    $scopeA.myAddedProp3 = "baz";
}

我在NodeJS和其他库中也遇到过这个问题 - 当你只需添加一些属性而又不想打扰接口时。

搜索提供所有这些选项，但是没有更好的方法吗？像

这样的东西

 $scope*.newProp = "foo";

Answer 1

如果你在范围内放置一个类：

interface IMyScope extends ng.ISCope { 
    vm:SomeClass;
}

link:($scope:IMyScope){

    scope.vm = new SomeClass();
}

然后您可以向SomeClass添加新属性，而无需手动维护界面。

更好地使用指令上的controller选项为您设置一个类。

Answer 2

您可以使用通用范围将VM强烈输入控制器：

interface IScope<T> extends angular.IScope {
    vm: T;
}

class MyController {

    private vm: MyViewModel;

    static $inject = ['$scope'];
    constructor(scope: IScope<MyViewModel>) {

        super();

        this.vm = new MyViewModel();

        scope.vm = this.vm;
    }
}

TypeScript - 在不声明新接口的情况下，为类型化对象添加新属性的最佳语法？

2 个答案: