Tengo dos etiquetas div diferentes en mi código html que hace referencia al mismo controlador en AngularJS. Lo que sospecho es que, como estos divs no están anidados, cada uno tiene su propia instancia del controlador, por lo que los datos son diferentes en ambos.

<div ng-controller="AlertCtrl">
<ul>
    <li ng-repeat="alert in alerts">
        <div class="span4">{{alert.msg}}</div>
    </li>
</ul>
</div>        
<div ng-controller="AlertCtrl">
<form ng-submit="addAlert()">
    <button type="submit" class="btn">Add Alert</button>
</form>
</div>

Sé que esto podría solucionarse fácilmente al incluir el botón en la primera división, pero creo que este es un ejemplo realmente limpio y simple para transmitir lo que estoy tratando de lograr. Si tuviéramos que presionar el botón y agregar otro objeto a nuestra matriz de alertas, el cambio no se reflejará en la primera división.

function AlertCtrl($scope) {

$scope.alerts = [{
    type: 'error',
    msg: 'Oh snap! Change a few things up and try submitting again.'
}, {
    type: 'success',
    msg: 'Well done! You successfully read this important alert message.'
}];

$scope.addAlert = function() {
    $scope.alerts.push({
        type: 'sucess',
        msg: "Another alert!"
    });
};
}