从 uiRouter 中的子状态更改父控制器属性答案

【问题标题】：Changing parent controller property from child state in uiRouter从 uiRouter 中的子状态更改父控制器属性
【发布时间】：2017-01-26 00:21:04
【问题描述】：

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

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

我的状态是这样设置的：

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

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

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

我希望该回调更改父控制器上的属性。

我可以做一些事情，比如在父控制器中注入 $scope，然后将属性添加到范围对象并使用范围继承来更改子级的属性，但我试图从项目中删除 $scope，而不是添加更多。有没有其他方法可以更新父控制器？

【问题讨论】：

标签： angularjs angular-ui-router

【解决方案1】：

在这样的链式情景中，

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

(function () {
    'use strict';

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

    MyService.$inject = [];

    /* @ngInject */
    function MyService() {



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

然后在您的孙子组件的控制器中注入MyService

doSomething() {

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

然后在你的父组件的控制器中注入MyService

$onInit() {

  this.myProperty = this.MyService.myProperty;
}

【讨论】：

谢谢，这正是我最终要做的。