我可以使用一个控制器更新AngularJS中的两个视图吗?

问题描述:

是否有可能将两个视图绑定到一个控制器,以便无论数据在哪里更改(视图1,视图2或模型中),两个视图都会更新?它应该像这个例子一样工作(消除混乱)。我可以使用一个控制器更新AngularJS中的两个视图吗?

<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> 

这里是一个Plunker:http://plnkr.co/edit/UDs10RhG7mJR8813epwO?p=preview

没有理由你不能做到这一点,但相同的对象必须是在两个控制器的范围。请参阅http://plnkr.co/edit/ILzGCs9AYiPTETE92KTm?p=preview

在原始示例中,每个作用域都有自己的对象,因此每个作用域都在它们自己的对象上运行。如果两个范围共享同一个对象,则每个范围都在同一个对象上运行,因此一个范围内的更改会反映在另一个范围内。

+0

太好了,真的很简单。谢谢! – acme