Ternary operator $parse error

[basarat]

Simple demo:

<div ng-app="myApp">    
    <button ng-click="foo ? bar=true : bas=true">click me</button>
</div>

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

Error : [$parse:syntax] Syntax Error: Token 'undefined' expected : at column null of the expression [foo ? bar=true : bas=true] starting at [foo ? bar=true : bas=true]

Fiddle : http://jsfiddle.net/basarat/pLMS6/

Angular Version : 1.2.21
I believe its feature not implemented.

[campersau]

It works if you surround the assignments with brackets: http://jsfiddle.net/pLMS6/1/

[a8m]

It's just the precedence and associativity of operators.
so you can do something like that:

<button ng-click="foo ? (bar = true) : (bas = false)">Click</button>

[basarat]

It's just the precedence and Associativity of operators.

Yes but I think $parse has it wrong.

foo ? (bar = true) : (bas = false)

= (assignment) will be evaluated (by JavaScript) after ?: (conditional). So in JavaScript you don't need the (). Angular's $parse shouldn't need it either. Perhaps it should be documented if not fixed.

Ref : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Operator_Precedence

[lgalfaso]

Looks like a bug and one that was present since the introduction of the ternary operator

[caitp]

I feel like this is probably a WONTFIX, angular expressions aren't javascript, and can't be expected to be a bugfree javascript interpreter.

[petebacondarwin]

But it could be quite a straightforward fix, if it is just about setting the precedence?

[petebacondarwin]

That being said we are trying to move away from assignment in expressions and a simple workaround is to call functions instead:

$scope.setBar = function(val) { $scope.bar = val; };
$scope.setBaz = function(val) { $scope.baz = val; };

foo ? setBar(true) : setBas(false)

will work

[lgalfaso]

@petebacondarwin you beat me on this. The question is if within the ternary operator expressions should we allow assignments or a filter chain

[petebacondarwin]

I quite like the idea of filterChain actually!