Angular - 从视图访问枚举

Angular - Access Enums from view

我有一些服务器端枚举要发送到 angular 应用程序。

理想情况下,我希望能够访问此类行为的枚举:

<select ng-options="type.name as type.value for type in Enums.TYPES" />

我已经尝试了几种方法来让它工作:

angular.module('myModule').constant('Enums', {myEnumObject})

var Enums = {myEnumObject};

$window.Enums = {myEnumObject};

显然,none 这些方法使对象可以从视图访问。我也尝试过使用服务来 return 对象,但这并不能从视图中访问它。

我的问题是我知道它可以从范围内完成,使用以下之一:

$rootScope.Enums = {myEnumObject};
OR
$scope.Enums = {myEnumObject};

我对此的担心是这似乎不可持续。使用范围似乎是一种不好的做法,因为创建的每个子范围都会被此数据污染。

我也可以通过将枚举分配给控制器来实现,但这似乎违背了拥有这些全局对象的目的。实际上,它们是永不改变的常量。

看来我一定是漏掉了什么。有人能为我指出正确的方向来维护此代码的可持续性,并以 "angular" 方式处理它吗?谢谢

你可以这样做:

angular.module('myModule').constant('Enums', {myEnumObject})

然后在任何你想使用它的范围内,你可以

$scope.Enums = Enums;

这不是很污染,只有需要它的范围才会设置它。

全局常量可以放在$rootScope上,这可以看作是污染。但是,如果这是您在整个应用程序中的各种指令中确实需要的东西,那没什么大不了的(IMO)。此问题没有正确答案。

避免将常量或服务枚举附加到您需要的每个范围的一种方法是对您的应用程序采用以指令为中心的设计。由于指令可以有独立的作用域,您可以将 views/controller 和 作用域绑定 捆绑在一个很好的可重用包中。例如:

.directive('SomeEnumThing', function(Enums){
    return {
        scope: {}, // don't forget to set an isolate scope on the directive
        templateUrl: 'sometpl.html',
        link: function(scope, elem, attrs){

            // bind the enums to your directive's scope
            scope.enums = Enums;
        }
    };
});

此方法的唯一缺点是在编写指令时过于冗长(但最终更可重用),以及设置与外部对象的任何其他必要绑定的额外要求(因为您现在处于一般范围层次结构之外) ).