ngIf and ngShow mistreats "[]" (empty array)

[jrencz]

If ngIf/ngShow if given an argument of a string of 2 characters: "[" and "]" it is treated as if it would be [] - empty array, which is neither true nor false.

Here's a test (utilizing ngIf only)
http://jsfiddle.net/VeJfM/1/

[petebacondarwin]

I am not sure I agree with this. From my chrome console:

[] == true
false

[] != true
true

(![]) == true
false

[''] == true
false

(!['']) == true
false

"" == true
false

"[]" == true
false

(!"[]") == true
false

[petebacondarwin]

OK, I think I see what you are saying. So it seems like a design choice. See https://github.com/angular/angular.js/blob/master/src/Angular.js#L838

[mgol]

@petebacondarwin. ngIf and ngShow don't compare expression being equal in the sense of == to true but them being truthy; otherwise you couldn't pass references to objects to them.

From the following two examples the first will log 'a', the second: 'b':

if ('[]') {
    console.log('a');
} else {
    console.log('b');
}

if ([]) {
    console.log('a');
} else {
    console.log('b');
}

[jrencz]

@petebacondarwin: you're right, and it's like that for more than 3 years now in https://github.com/angular/angular.js/blob/a7d62dcb5533ceb9a7ae47ee27e2054400a0196b/src/Angular.js

But if it's by design should it return nothing? Shouldn't it trigger some kind of error informing developer to pass custom function implementing logic and returning either true or false?
The case of "[]" and [] is unsolvable since there's no ngIfNot like there's ngHide for ngShow

[mgol]

@petebacondarwin It seems illogical that ng-if can return false on both !x and x. This kind of interpolation is also inconsistent with the rest of JavaScript and even internally with Angular expressions, e.g. ng-if="'[]'" evaluates to false and an element is hidden but {{ '[]' ? 'a' : 'b' }} and {{ [] ? 'a' : 'b' }} both print 'a' which means an empty array (as well as the string '[]') is truthy in this case. Why not just be consistent with JS?

Our use case is that we download a JSON from the server with some fields populated with user data. One of these fields should trigger showing a particular element only if the user actually wrote anything in that field (i.e. it's a non-empty string). But one of the things user can write is [], obviously which makes the element hide. This also seems unexpected as we didn't expect a string from the server to be parsed against some kinds of expressions.

[IgorMinar]

v == '[]' in https://github.com/angular/angular.js/blob/master/src/Angular.js#L838 is wrong.

the javascript truthiness type coercion is crazy too though. (all of these are falsy: [], [0], [false], [''])

[mgol]

@IgorMinar That's not true, everything you mentioned is truthy... As is every object, even ones without any keys.
The most common falsey values are false, null, undefined, 0 and "" and that's about it.

JS has some crazy coercion rules so to be clear, the value x is truthy if and only if !!x is true, falsey otherwise. x being truthy is equivalent to the following code printing 'a' to the console:

if (x) {
    console.log('a');
} else {
    console.log('b');
}

[maddie927]

Is this resolved? All the boolean angular expressions I've seen are using angular's toBoolean method, which treats empty arrays as falsy. I agree with @mzgol, it doesn't make any sense to allow JavaScript boolean logic inside an expression and then evaluate the result using something completely different. "[]" -> false, "![]" -> false (what!?), "!![]" -> true (makes sense, but then you'd expect "[]" to be truthy too)