angularjs - Angular ng-if + function not work -

in first code when change anoini, gerar() function show old value.

but, when remove <div ng-if.... works fine.

do knows what's wrong ?

tks

// javascript document  var app = angular.module('dadoshist', []);    app.controller('dadoshistctrl', function($scope) {  	$scope.mesini = 1; $scope.anoini = 2011;  	$scope.mesfim = 7; $scope.anofim = 2015;  	$scope.log = "";  	$scope.escolherperiodo = true;  	  	$scope.gerar = function() {      		this.log = this.anoini;  		meses = ((this.anofim - this.anoini) * 12) + (12 - this.mesini) + this.mesfim;  		qtdloop = arrestacoes.length * meses;  		tempoestimadominutos = math.round((qtdloop * 20)  / 60 );            this.log = 'tempo estimado: ' + tempoestimadominutos + ' min.' ;  	}  });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>      <div ng-app="dadoshist" ng-controller="dadoshistctrl">  <input type="checkbox" ng-model="escolherperiodo">escolher período<br>  <div ng-if="escolherperiodo">  <input type="text" ng-model="mesini" placeholder="mes">/<input type="text" ng-model="anoini" placeholder="ano"><br>  <input type="text" ng-model="mesfim" placeholder="mes">/<input type="text" ng-model="anofim" placeholder="ano"><br>  </div>  <button ng-click="gerar()">gerar</button> <br>    {{log}}            </div>

always use dot in ng-model ! . in other words use objects not primitives.

ng-if creates child scope , since using primitives in ng-model losing 2 way binding scope child scope.

var mymodel ={       mesini : 1,       anoini : 2011,       mesfim : 7,       anofim : 2015 }; $scope.mymodel = mymodel; 

html

<input type="text" ng-model="mymodel.mesini"> 

then in function:

$scope.gerar = function() {      $scope.log = mymodel.anoini;     var meses = ((mymodel.anofim - mymodel.anoini)......       ..... } 

understanding scope nesting in angular important thing learn when using framework