angularjs - 在 uiRouter 中从子状态更改父 Controller 属性

Question

我正在重构 Angular 1.5 应用程序，并尝试在不拆开整个应用程序的情况下解决问题。

我的问题是这样的；我有一个带有属性的父状态 Controller 。子状态模板包含需要更新父状态属性的组件。

我的状态设置如下:

$stateProvider
  .state('parent', {
    abstract: true,
    component: 'parentComponent'
  })
  .state('parent.child', {
    url: '/child',
    component: 'childComponent'
  })

子组件有一个模板，其中包含它自己的组件，该组件将 Controller 方法指定为回调:

 <grand-child on-change="$ctrl.doSomething()"></grand-child>

我希望回调能够更改父 Controller 上的属性。

我可以做类似在父 Controller 中注入(inject) $scope 的操作，然后将属性添加到范围对象并使用范围继承来更改子级的属性，但我试图从项目中删除 $scope，而不是添加更多。还有其他方法可以更新父 Controller 吗？

Answer 1

在这样一个链式的场景中，

我建议您将属性存储在服务中

(function () {
    'use strict';

    angular
        .module('app')
        .service('MyService', MyService);

    MyService.$inject = [];

    /* @ngInject */
    function MyService() {



        this.myProperty = ''; // some default value if exists
    }
})();

在您的孙组件的 Controller 中注入(inject)MyService，然后

doSomething() {

  this.MyService.myProperty = 'some new value';
}

在父组件的 Controller 中注入(inject) MyService 然后

$onInit() {

  this.myProperty = this.MyService.myProperty;
}