<!DOCTYPE html>
<html ng-app="app">
<head>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.js"></script>
<script src="script.js"></script>
</head>
<body ng-controller="PruebaController">
<input type="checkbox" ng-model="showNombre">¿Mostrar nombre?
<br>
<div ng-if="showNombre">
Nombre: <input ng-model="nombre" >
<br>
El valor de "nombre" en el $scope del "ng-if" es : {{nombre}}
</div>
El valor de "nombre" en el $scope del "Controlador" es : <strong>{{nombre}}</strong>
<hr>
<input type="checkbox" ng-model="modelo.showApellido">¿Mostrar apellido?
<br>
Apellido: <input ng-model="modelo.apellido" >
<div ng-if="modelo.showApellido">
<br>
El valor de "apellido" en el $scope del "ng-if" es : {{modelo.apellido}}
</div>
El valor de "apellido" en el $scope del "Controlador" es : {{modelo.apellido}}
</body>
</html>
var app = angular.module("app", []);
app.controller("PruebaController", function($scope) {
$scope.nombre="Carlos";
$scope.showNombre=true;
$scope.modelo={
apellido:"Perez",
showApellido:true
}
});
Ejemplo de ng-if y herencia de $scope