如何在Angular表達式中獲得一個範圍變量的類型？

Question

讓我們定義的範圍簡單的布爾：

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

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

我怎樣才能在表達式中的變量的類型？ typeOf和Object.prototype.Tostring.call不起作用。

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

這裏的jsfiddle：http://jsfiddle.net/g8Ld80x3/2/

Answer 1

我認爲最好的方法是創建一個自定義過濾器，當你希望你的表達中，可以檢查this鏈接，用於獲取對象使用它。爲你的情況下，對象

的鍵，你可以使用

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

Answer 2

嘗試在控制器這樣的事情（如你想要做的，我不認爲是可能直接在表達式）：

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>

Answer 3

你不能這樣做，並有充分的理由：Angular expression解析器不允許這樣的在模板中。

如果你真的希望能夠這樣做，我建議明確設定在$rootScope輔助方法，所以它會在您所有的模板可用：

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

，你甚至可以參考角度自己的實用方法：

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

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

Answer 4

當您嘗試訪問特定值的typeof類型和當前代碼時，您在view中執行此操作，這對於此類操作來說相當晚。

相反，你可以做一個函數在控制器的範圍，只是從那裏返回它：

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>

Answer 5

HTML

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

JS

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

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

結果

false 
boolean 

Answer 6

只是爲了顯示應用到我的示例代碼Zamboney的回答是：

控制器：

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; 
}); 

查看：

<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> 

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

Answer 7

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

//根據上述說法，該對象將被typeof運算符的結果。它不檢查typeof操作符：http://bonsaiden.github.io/JavaScript-Garden/#types.typeof