javascript - Angular js中同一 Controller 的两个实例

Question

我遇到了这个问题(我知道这不是一个好的做法)。我有一个具有分屏的 View 。在左侧您有一个输入字段，在右侧您可以看到输入字段值。双方都有相同的 Controller ，但我使用带有 ui-view 属性的状态提供程序。

index.html

<div class="col-sm-6" ui-view="left-side">
<div class="col-sm-6" ui-view="right-side">

app.js

$stateProvider.state('/',{
        url: '/',
         views:{
            'left-side':  {
                templateUrl: 'leftside.html',
                controller: 'testController'
            },
            'right-side': {
                 templateUrl: 'rightside.html'
                 controller: 'testController'
            }
        }

rightside.html

<div class="container">
    <p>{{item}}</p>
</div>

leftside.html

<div class="container">
    <input ng-model="item" />
</div>

并且在 testController.js

app.controller('testController, function($scope){
    $scope.item = 'some text value';
});

我知道每个 ui-view 都有一个单独的(实例？)范围。 如果我在左侧的输入字段中写一些东西，有没有办法在右侧进行更改？

Answer 1

您可以在 View 外声明controller 选项，这样只会初始化一次

代码

$stateProvider.state('/',{
    url: '/',
    controller: 'testController',
    views:{
       'left-side':  {
       templateUrl: 'leftside.html'
    },
      'right-side': {
       templateUrl: 'rightside.html
    }
}