stofl stofl - 1 year ago 99
Javascript Question

Model does not update within ng-if

I've got a strange behavior in an angular application and I don't know if that's a bug or a known limitation:

'use strict';

var ctrl = function ($scope) {
$ = false;

<script src=""></script>
<div ng-app ng-controller="ctrl">
foo: {{foo}}
<div ng-if="foo" style="background-color: #f00;">
<div ng-if="!foo">
<br/><button ng-click="foo = true;">Show foo</button>
<button ng-click="foo = true">Show foo</button>

I would expect that clicking one of the buttons would set
foo = true
, but clicking the first button (within the
) doesn't change the model.

Tested version is

Answer Source

ng-if has its own scope, so you need to use:

<br/><button ng-click="$ = true;">Show foo</button>

Updated fiddle:

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download