Javascript 如何在 Angular 表达式中获取一种范围变量？

How to get a type of scope variable in Angular expression?

提问by Landeeyo

Let's define simple boolean on the scope:

让我们在范围上定义简单的布尔值：

var mymodal = angular.module('mymodal', []);

mymodal.controller('MainCtrl', function ($scope) {
    $scope.b = false;
});

How can I get type of a variable in the expression? typeOfand Object.prototype.Tostring.calldon't work.

如何在表达式中获取变量的类型？typeOf并且Object.prototype.Tostring.call不工作。

<div ng-controller="MainCtrl" class="container">
        <div>
          {{ b }}
          {{ typeOf(b) }}
          {{ Object.prototype.toString.call(b) }}
        </div>
</div>

Here's JSFiddle: http://jsfiddle.net/g8Ld80x3/2/

这是 JSFiddle：http: //jsfiddle.net/g8Ld80x3/2/

回答by Zamboney

i think the best way is to create a custom filter and use it as you wish within you expression, you can check thislink that use for get the Object.keys of an object

我认为最好的方法是创建一个自定义过滤器，当你希望你表达式中使用它，你可以检查这个链接使用了获取对象的Object.keys

for your case you can use

对于您的情况，您可以使用

angular.module('customfilter', []).filter('typeof', function() {
  return function(obj) {
    return typeof obj
  };
});

回答by Landeeyo

Just to show Zamboney's answer applied to my sample code:

只是为了显示 Zamboney 的答案适用于我的示例代码：

Controller:

控制器：

angular.module('customfilter', []).filter('getType', function() {
  return function(obj) {
    return typeof obj
  };
});

var mymodal = angular.module('mymodal', ['customfilter']);

mymodal.controller('MainCtrl', function ($scope) {
    $scope.b = false;
});

View:

看法：

<div ng-controller="MainCtrl" class="container">
  <div>
    {{ b }}
    {{ b | getType }}
    <div ng-if="(b | getType) == 'number'">
      It's a number
    </div>
    <div ng-if="(b | getType) == 'boolean'">
      It's a boolean
    </div>
  </div>
</div>

And fiddle: http://jsfiddle.net/g8Ld80x3/5/

和小提琴：http: //jsfiddle.net/g8Ld80x3/5/

回答by dfsq

You can't do it and for the good reason: Angular expressionparser disallows such sort of things in the templates.

您不能这样做，这是有充分理由的：Angular 表达式解析器不允许在模板中进行此类操作。

If you really want to be able to do so, I recommend to explicitly set helper methods on the $rootScopeso it will be available in all your templates:

如果您真的希望能够这样做，我建议在 上显式设置辅助方法，$rootScope以便它可以在您的所有模板中使用：

mymodal.run(function($rootScope) {
    $rootScope.typeOf = function(value) {
        return typeof value;
    };
});

You can even reference Angular own utility methods:

你甚至可以引用 Angular 自己的实用方法：

 mymodal.run(function($rootScope) {
    ['isArray', 'isDate', 'isDefined', 'isFunction', 'isNumber', 'isObject', 'isString', 'isUndefined'].forEach(function(name) {
        $rootScope[name] = angular[name];
    });
});

and use {{ isArray(arr) }}in templates.

并{{ isArray(arr) }}在模板中使用。

回答by Ionut Necula

Try something like this in the controller(I don't think is possible directly in the expression as you want to do):

在控制器中尝试这样的事情（我认为不可能直接在你想做的表达式中）：

var mymodal = angular.module('mymodal', []);

mymodal.controller('MainCtrl', function ($scope) {
    $scope.b = false;
    $scope.getBType = function(test){
        return( typeof test);
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app='mymodal' ng-controller="MainCtrl" class="container">
        <div>
          {{ getBType(b) }}
        </div>
</div>

回答by Jai

As you are trying to access the type typeofof the specific value and in the current code you are doing this in the viewwhich is quite late for such operation.

当您尝试访问typeof特定值的类型并且在当前代码中您正在执行此view操作时，对于此类操作来说已经很晚了。

Instead you can make a function in the controller's scope and just return it from there:

相反，您可以在控制器的范围内创建一个函数，然后从那里返回它：

var mymodal = angular.module('mymodal', []);

mymodal.controller('MainCtrl', function ($scope) {
    $scope.b = false;
    $scope.getTypeof = function(it){ return typeof(it); };
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app='mymodal' ng-controller="MainCtrl" class="container">
        <div>
          {{ b }} : {{ getTypeof(b) }}
          
        </div>
</div>

回答by georgeawg

HTML

HTML

<div ng-controller="MainCtrl" class="container">
        <div>
          {{ b }}<br>
          {{ typeOf(b) }}<br>
        </div>
</div>

JS

JS

var mymodal = angular.module('mymodal', []);

mymodal.controller('MainCtrl', function ($scope) {
    $scope.b = false;
    $scope.typeOf = function (v){ return (typeof v)};
});

RESULT

结果

false
boolean

回答by anarchist

$scope.b = new String('name');

// according to the above statement, the object will be the result of the typeof operator. It does not check the type of the typeof operator: http://bonsaiden.github.io/JavaScript-Garden/#types.typeof

// 根据上面的说法，对象将是typeof运算符的结果。它不检查 typeof 运算符的类型：http: //bonsaiden.github.io/JavaScript-Garden/#types.typeof