草庐IT

javascript - Angular.js 和 ng-switch-when - 模拟枚举

coder 2024-05-15 原文

为了某种类型安全，我想在我的 Controller 逻辑中引入一些枚举，所以例如我创建了这样的东西:

var app = angular.module('myApp', []);
var StateEnum = Object.freeze({"login":1, "logout":2})
function LoginCheckCtrl($scope) {
    $scope.stateEnum = StateEnum
    $scope.loginData = StateEnum.login
    $scope.login = function() {
        console.log($scope.loginData  ? 'logged in' : 'not logged in');
        $scope.loginData = StateEnum.logout;
    };
    $scope.logout = function() {
        console.log($scope.loginData ? 'logged in' : 'not logged in');
        $scope.loginData = StateEnum.login;
    };
}

在我的示例页面中，我会有这样的内容:

<div ng-controller="LoginCheckCtrl">
   <div ng-switch on="loginData"> 
      <div ng-switch-when="stateEnum.login" ng-include="'login'"></div>
      <div ng-switch-when="stateEnum.logout" ng-include="'logout'"></div>
   </div>
</div>

<script type="text/ng-template" id="login">
    <button ng-click="login()">Login</button>
</script>

<script type="text/ng-template" id="logout">
    <button ng-click="logout()">Logout</button>
</script>

但是 ng-switch-when 不想工作。它仅在我用整数手动替换 ng-swith-when 中的值时才有效，例如 1,2。

这里有 fiddle 来证明这一点:

http://jsfiddle.net/jNxyE/3/

http://jsfiddle.net/4Jg7M/2/

现在，如您所见，第一个显然不起作用，而第二个起作用 - 这意味着它会在单击按钮时更改按钮。

我认为这个问题是 var StateEnum = Object.freeze({"login":1, "logout":2})。

是否可以在我的 html 中使用我的枚举，这样 ng-switch-when 将正常工作(如第二个 fiddle )？

最佳答案

我想我会创建一个可以包含所有枚举的服务:

angular.module('Enums', []).
   factory('Enum', [ function () {

      var service = {
        freeze: {login:1, logout:2 },
          somethingelse: {abc:1,def:2}
      };

     return service;

    }]);

您的应用定义如下:

var app = angular.module('myApp', ['Enums']);

然后你的 Controller 可以在你需要的时候注入(inject)它们:

function LoginCheckCtrl($scope, Enum) {
    if (1==Enum.freeze.login) // as an example
    if (1==Enum.somethingelse.abc)  // another example

服务是单例的，因此这有效地为您提供了一组您可以定义的枚举。

至于 ngSwitch when 指令，我认为它需要一个字符串(如果我错了请纠正我)。一些引用资料:

https://groups.google.com/forum/?fromgroups#!topic/angular/EH4W0y93ZAA https://github.com/angular/angular.js/blob/master/src/ng/directive/ngSwitch.js#L171

另一种实现您想要的方法是使用 ng-show/ng-hide

<div ng-include="'login'" ng-show='stateEnum.login==loginData' ...>

关于javascript - Angular.js 和 ng-switch-when - 模拟枚举，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16627860/

ng-switch-whenjavascriptcodelogin34angularjsenums

有关javascript - Angular.js 和 ng-switch-when - 模拟枚举的更多相关文章

  1. ruby-on-rails - rails : "missing partial" when calling 'render' in RSpec test - 2

    我正在尝试测试是否存在表单。我是Rails新手。我的new.html.erb_spec.rb文件的内容是:require'spec_helper'describe"messages/new.html.erb"doit"shouldrendertheform"dorender'/messages/new.html.erb'reponse.shouldhave_form_putting_to(@message)with_submit_buttonendendView本身，new.html.erb，有代码:当我运行rspec时，它失败了:1)messages/new.html.erbshou

  2. ruby - 如何模拟 Net::HTTP::Post？ - 2

    是的，我知道最好使用webmock，但我想知道如何在RSpec中模拟此方法:defmethod_to_testurl=URI.parseurireq=Net::HTTP::Post.newurl.pathres=Net::HTTP.start(url.host,url.port)do|http|http.requestreq,foo:1endresend这是RSpec:let(:uri){'http://example.com'}specify'HTTPcall'dohttp=mock:httpNet::HTTP.stub!(:start).and_yieldhttphttp.shou

  3. ruby - 主要 :Object when running build from sublime 的未定义方法 `require_relative' - 2

    我已经从我的命令行中获得了一切，所以我可以运行rubymyfile并且它可以正常工作。但是当我尝试从sublime中运行它时，我得到了undefinedmethod`require_relative'formain:Object有人知道我的sublime设置中缺少什么吗？我正在使用OSX并安装了rvm。 最佳答案 或者，您可以只使用“require”，它应该可以正常工作。我认为“require_relative”仅适用于ruby​​1.9+ 关于ruby-主要:Objectwhenrun

  4. Ruby 元类 : why three when defined singleton methods? - 2

    让我们计算MRI范围内的类别:defcount_classesObjectSpace.count_objects[:T_CLASS]endk=count_classes用类方法定义类:classAdefself.foonilendend然后运行:putscount_classes-k#=>3请解释一下，为什么是三个？ 最佳答案 查看MRI代码，每次你创建一个Class时，在Ruby中它是Class类型的对象，ruby会自动为这个新类创建“元类”类，这是另一个单例类型的Class对象。C函数调用(class.c)是:rb_define

  5. ruby - 怎么来的(a_method || :other) returns :other only when assigning to a var called a_method? - 2

    给定以下方法:defsome_method:valueend以下语句按我的预期工作:some_method||:other#=>:valuex=some_method||:other#=>:value但是下面语句的行为让我感到困惑:some_method=some_method||:other#=>:other它按预期创建了一个名为some_method的局部变量，随后对some_method的调用返回该局部变量的值。但为什么它分配:other而不是:value呢？我知道这可能不是一件明智的事情，并且可以看出它可能有多么模棱两可，但我认为应该在考虑作业之前评估作业的右侧...我已经在R

  6. ruby-on-rails - 在这种情况下我如何模拟一个对象？没有明显的方法可以用模拟替换对象 - 2

    假设我在Store的模型中有这个非常简单的方法:defgeocode_addressloc=Store.geocode(address)self.lat=loc.latself.lng=loc.lngend如果我想编写一些不受地理编码服务影响的测试脚本，这些脚本可能已关闭、有限制或取决于我的互联网连接，我该如何模拟地理编码服务？如果我可以将地理编码对象传递到该方法中，那将很容易，但我不知道在这种情况下该怎么做。谢谢!特里斯坦 最佳答案 使用内置模拟和stub的rspecs，你可以做这样的事情:setupdo@subject=MyCl

  7. ruby - "public/protected/private"方法是如何实现的，我该如何模拟它？ - 2

    在ruby中，你可以这样做:classThingpublicdeff1puts"f1"endprivatedeff2puts"f2"endpublicdeff3puts"f3"endprivatedeff4puts"f4"endend现在f1和f3是公共(public)的，f2和f4是私有(private)的。内部发生了什么，允许您调用一个类方法，然后更改方法定义？我怎样才能实现相同的功能(表面上是创建我自己的java之类的注释)例如...classThingfundeff1puts"hey"endnotfundeff2puts"hey"endendfun和notfun将更改以下函数定

  8. ruby - 在 RSpec 中 stub /模拟全局常量 - 2

    我有一个gem，它有一个根据Rails.env的不同行为的方法:defself.envifdefined?(Rails)Rails.envelsif...现在我想编写一个规范来测试这个代码路径。目前我是这样做的:Kernel.const_set(:Rails,nil)Rails.should_receive(:env).and_return('production')...没关系，只是感觉很丑。另一种方法是在spec_helper中声明:moduleRails;end而且效果也很好。但也许有更好的方法？理想情况下，这应该有效:rails=double('Rails')rails.sho

  9. ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法？ - 2

    我遇到了一个非常奇怪的问题，我很难解决。在我看来，我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时，我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性，其中包括href和data-method。再次单击此链接后，我的服务器收到了对新href的请求，但使用的是旧的data-method，即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是，如果我刷新页面，HTML与"new"HTML相同(随返回的JS发生变化)，但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

  10. ruby - 引用具有指定索引的枚举器值 - 2

    假设我有一个可枚举对象enum，现在我想获取第三个项目。我知道一种通用方法是转换成数组，然后使用索引访问，如:enum.to_a[2]但这种方式会创建一个临时数组，效率可能很低。现在我使用:enum.each_with_index{|v,i|breakvifi==2}但这非常丑陋和多余。执行此操作最有效的方法是什么？ 最佳答案 你可以使用take剥离前三个元素，然后剥离last从take给你的数组中获取第三个元素:third=enum.take(3).last如果您根本不想生成任何数组，那么也许:#Ifenumisn'tanEnum

随机推荐