javascript - Ui-view 不更新 Controller 中的值

Question

我有一个catalog.html Angular 应用程序，其中有2个ui View ，它们位于同一 Controller categoryCtrl下:

catalog.html

<!-- SEARCH -->         
<div ui-view="search-catalog"></div>
<!-- CONTENT -->            
<div ui-view="result"></div>

app.js

.state('catalog', {
url: '/catalog',
views: {
    'search-catalog': {
      templateUrl: 'views/search-catalog.html',
      controller: 'categoryCtrl'
    },
    'result': {
      templateUrl: 'views/result.html',
      controller: 'categoryCtrl'
    },

当我更改 search-catalog 中的某些内容并可以看到categoryCtrl 内的更改时，这些更改不会反射(reflect)在结果 中。特别是，我有一个数组 $scope.items 并且 ng-repeat 不会更新其值

Answer 1

如上所述，categoryCtrl 已被复制到两个单独的范围，因此，如果您修改 search-catalog 范围中的 $scope.items 对象，将不会反射(reflect)在结果中范围。如果您不介意在父作用域(目录)上移动逻辑，您还可以执行以下操作:

.state('catalog', {
  url: '/catalog',
  views: {
      '': {
        templateUrl: 'catalog.html',
        controller: 'catalogCtrl'
      },

      'search-catalog@catalog': {
        templateUrl: 'views/search-catalog.html'              
      },

      'result@catalog': {
        templateUrl: 'views/result.html'              
      }
  }

.controller("catalogCtrl", function($scope) {
    $scope.items = ["item1", "item2", "item3"];
  });

在这种情况下，嵌套 View 将绑定(bind)到相同的 Controller /范围。如果您想将嵌套 View 和父 View 之间的逻辑分开，您应该使用单例(例如服务或工厂)并将其注入(inject)到嵌套 View 中。