javascript AngularJS 中布尔表达式的计算

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/30375547/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-28 12:06:24  来源:igfitidea点击:

Evaluation of boolean expressions in AngularJS

javascriptangularjs

提问by micmia

I'm testing the ng-showand AngularJS expressions, but I found something I can't understand. I created a variable displayedand assigned a string 'false'(not boolean) to it. The expression displayed && trueis evaluated to true, and the second div is shown without problem (because a string and true should be true). I know there are some differences between Angular expressions and JavaScript expressions, however I don't know why the first div is not shown; it seems that the displayedis compiled to a boolean by Angular.

我正在测试ng-show和 AngularJS 表达式,但我发现了一些我无法理解的东西。我创建了一个变量displayed'false'为其分配了一个字符串(不是布尔值)。表达式displayed && true被评估为真,第二个 div 显示没有问题(因为字符串和真应该为真)。我知道 Angular 表达式和 JavaScript 表达式之间存在一些差异,但是我不知道为什么第一个 div 没有显示;似乎displayed被 Angular 编译为布尔值。

Here is the jsfiddle: http://jsfiddle.net/micmia/1psf70tv/3/

这是 jsfiddle:http: //jsfiddle.net/micmia/1psf70tv/3/

Template:

模板:

<div ng-controller="MyCtrl">
    <div ng-show="displayed">test1</div>
    <div ng-show="displayed && true">test2</div>
</div>

Controller:

控制器:

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

myApp.controller('MyCtrl', function ($scope, $parse) {
    $scope.displayed = 'false';
});

采纳答案by eladcon

That's how angular evaluated the string 'false'and 'f'and some others as well. There was an open bugabout it.

这就是角度评估字符串'false''f'其他一些字符串的方式。有一个关于它的开放错误

See this fiddleworks with a later version.

请参阅此小提琴适用于更高版本。

回答by Sourabh Ranka

Here I have directly passed the string as a attribute value to ng-show directive and since as per javaScript typeConversion it should evaluate to true but this is not happening here with string values(result into false),although it is working fine for numeric values.

在这里,我直接将字符串作为属性值传递给 ng-show 指令,并且因为根据 javaScript typeConversion 它应该评估为 true 但这不会发生在字符串值(结果为 false)的情况下,尽管它对数值工作正常.

So this is a bug in evaluating boolean expressions in angularJs.

所以这是在 angularJs 中评估布尔表达式的一个错误。

My Code:

我的代码:

 <div ng-controller="myController">
    <input type="text" ng-model="name">
    <p>{{name}}</p>
    <p>{{10+10}}</p>
    <button type="button" ng-click="myFunction(this)">click Me !!</button>

    <p ng-show="rabbit">The name is {{ name | uppercase }}</p>

  </div>

回答by VigneshRaja

If you are using string variable in ng-show or ng-hide means you can check the variable like expression shown below:

如果您在 ng-show 或 ng-hide 中使用字符串变量意味着您可以检查如下所示的变量:

Template:

模板:

<div ng-controller="MyCtrl">
    <div ng-show="displayed != null">test1</div>  
    <div ng-show="displayed == 'false'">test2</div>
</div>

Controller:

控制器:

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

myApp.controller('MyCtrl', function ($scope, $parse) {
    $scope.displayed = 'false';
});

now both div will be shown correctly

现在两个 div 都将正确显示

If you are using boolean variable in ng-show or ng-hide means you can check the variable like shown below:

如果您在 ng-show 或 ng-hide 中使用布尔变量意味着您可以检查如下所示的变量:

Template:

模板:

<div ng-controller="MyCtrl">
    <div ng-show="displayed">test1</div>  
    <div ng-show="!displayed">test2</div>
</div>

Controller:

控制器:

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

myApp.controller('MyCtrl', function ($scope, $parse) {
    $scope.displayed = false;
});

for above Boolean condition first div will not be shown and second div will be showed.

对于上述布尔条件,第一个 div 将不显示,第二个 div 将显示。