I have my code as follows:
one_time.js
var sample = angular.module('sample', []);
sample.controller('OneTimeController', function () {
this.name = 'John';
this.blah = 'sdflk';
});
index.html
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<script type="text/javascript" src="one_time.js"></script>
</head>
<body ng-app="sample">
<div ng-controller="OneTimeController as test">
<p>Input something in the input box:</p>
<p>Name: <input type="text" ng-model="test.name" value="John"></p>
<p ng-bind="test.name"></p>
<p ng-bind="::test.name"></p>
<p ng-if="test.name && test.blah">testing</p> <!-- works perfectly-->
<p ng-if="::test.name && test.blah">testing with first expression as one time binded</p> <!-- works but the second property is not one time binded-->
<p ng-if="::test.name && ::test.blah">testing with one time bind</p><!-- doesn't work throws syntax error-->
</div>
</body>
</html>
I am trying to show a <p>
tag with an ng-if condition in which I want name property to be one time binded. I already know that it'll not change so wanted to try one time binding in ng-if also. It works perfectly when I don't use one time binding or when I only use one time binding with the first expression in this case <p ng-if="::test.name && test.blah">testing with first expression as one time binded</p>
, however when I try to use one time binding in more than one expression coupled with a guard operator it throws me error as syntax error:
Error: [$parse:syntax] Syntax Error: Token ':' not a primary expression at column 14 of the expression [test.name && ::test.blah && ::test.blah] starting at [::test.blah && ::test.blah].
http://errors.angularjs.org/1.3.14/$parse/syntax?
Is this a bug or genuine syntax error ? I am using angularjs version 1.3.14.
I think You should use ()
for on-time-bindings with expressions ex.:<p ng-if="::(test.name && test.blah)">testing with first expression as one time binded</p>
@piernik Thanks works like a charm. I was trying (::test.name) && (::test.blah)
but it seems like the very first ::
activates one time binding. :+1:
one time binding (::) applies to all the expressions used within the ng-if.
<p ng-if="::test.name && test.blah"> is same as <p ng-if="::(test.name && test.blah)">
Unfortunately we cannot mix one time binding with one way binding expressions in a single expression in angular js.
Most helpful comment
I think You should use
()
for on-time-bindings with expressions ex.:<p ng-if="::(test.name && test.blah)">testing with first expression as one time binded</p>