0

Is it possible, to have two views bound to one controller, so that both views get updated no matter where the data was changed (view1, view2 or in the model)? It should work like this example (removed clutter).

<script>
    angular.module('foobar', []).controller('ContentCtrl', ['$scope', function($scope) {
        $scope.content = {'title': 'Foo', 'subtitle': 'Bar', 'text': 'desc'};
    }]);
</script>

<form action="#" ng-controller="ContentCtrl">
    <input type="text" ng-model="content.title">
    <input type="text" ng-model="content.subtitle">
    <textarea ng-model="content.text"></textarea>
</form>

<div ng-controller="ContentCtrl">
    <input type="text" ng-model="content.title">
    <input type="text" ng-model="content.subtitle">
    <textarea ng-model="content.text"></textarea>
</div>

Here is a Plunker: http://plnkr.co/edit/UDs10RhG7mJR8813epwO?p=preview

acme
  • 14,654
  • 7
  • 75
  • 109

1 Answers1

5

There's no reason you can't do this, but the same object has to be in the scope of both controllers. See http://plnkr.co/edit/ILzGCs9AYiPTETE92KTm?p=preview

In the original example, each scope has it's own object, and so each is operating on their own object. If both scopes share the same object, then each is operating on the same object, and thus changes in one scope is reflected in the other.

dnc253
  • 39,967
  • 41
  • 141
  • 157