javascript - 带有 typeof 表达式的 ng-switch

Question

所以我有一个可以是任何类型的变量。所谓类型，我的意思是它可以是一个字符串或一个对象。我正在尝试根据类型运行不同的代码。

我的变量名为range，它是在 JavaScript 中定义的。我试过的是。vars是我正在循环的对象。

<tr ng-repeat="(key, range) in vars">
    <td ng-switch="typeof range">
        <span ng-switch-when="string">It's a string</span>
        <span ng-switch-when="object">It's an object</span>
        <span ng-switch-default>It's something else</span>
    </td>
</tr>

但这会引发无效的表达式错误。最好的方法是什么？

Answer 1

试试这个...我还添加了对不同类型变量的检测：string、array、object、number、null和undefined。

"use strict";
angular.module('myApp', [])
.controller("myController", function() {
    this.vars = {
        key1: "String",
        key2: "String2",
        key3: 42,
        key4: {
            name: "Mr. Anderson"
        },
        key5: [1, 2, 3, 4, 5],
        key6: null,
        key7: undefined
    };
    this.getTypeOf = function(value) {
        if(value === null) {
            return "null";
        }
        if(Array.isArray(value)) {
            return "array";
        }
        return typeof value; 
    };
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>

<table ng-app="myApp" ng-controller="myController as ctrl">
    <tr ng-repeat="(key, range) in ctrl.vars">
        <td ng-switch="ctrl.getTypeOf(range)">
            <div ng-switch-when="string">It's a string</div>
            <div ng-switch-when="object">It's an object</div>
            <div ng-switch-when="number">It's a number</div>
            <div ng-switch-when="array">It's an array</div>
            <div ng-switch-when="null">It's null</div>
            <div ng-switch-when="undefined">It's undefined</div>
            <div ng-switch-default>It's something else</div>
        </td>
    </tr>
</table>

Answer 2

控制器：

$scope.checkType = function(obj){    
 return typeof obj;
};

html:

 <tr ng-repeat="(key, range) in vars"
        <td ng-switch="checkType(range)">
            <span ng-switch-when="string">It's a string</span>
            <span ng-switch-when="object">It's an object</span>
            <span ng-switch-default>It's something else</span>
        </td>
    </tr>