Javascript 当使用控制器作为语法时，如何从父指令继承属性？

我想在Angular指令中使用控制器作为语法，原因有两个。它是更简单的JS，并且不依赖于$scope服务，这在Angular 2.0中是不可用的

它对于单个指令非常有效，但我不知道如何在子指令中从父指令的控制器打印属性

function parentCtrl () {
  this.greeting = { hello: 'world' };
}

function childCtrl () {}


angular.module('app', [])
  .controller('parentCtrl', parentCtrl)
  .controller('childCtrl', childCtrl)
  .directive('myParent', function () {
    return {
      scope: {},
      bindToController: true,
      controller: 'parentCtrl',
      controllerAs: 'parent',
      template: '<my-child></my-child>'
    }
  })
  .directive('myChild', function () {
    return {
      scope: {
        greeting: '='
      },
      bindToController: true,
      controller: 'childCtrl',
      controllerAs: 'child',
      template: '<p>{{ greeting.hello }}</p>'
    }
  });

函数parentCtrl（）{
this.greeting={hello:'world'}；
}
函数childCtrl（）{}
角度.module（'app'，[]）
.controller（'parentCtrl'，parentCtrl）
.controller（'childCtrl'，childCtrl）
.指令（'myParent'，函数（）{
返回{
作用域：{}，
bindToController：对，
控制器：“parentCtrl”，
controllerAs:'父'，
模板：“”
}
})
.directive（'myChild'，函数（）{
返回{
范围：{
问候语：'='
},
bindToController：对，
控制器：“childCtrl”，
controllerAs:“孩子”，
模板：'{{greeting.hello}}
'
}
});

您必须

要求

父控制器，使用

链接

功能将父控制器注入子控制器。

myChild

指令将变成：

.directive('myChild', function () {
    return {
        scope: {
            // greeting: '=' // NO NEED FOR THIS; USED FROM PARENT
        },
        bindToController: true, // UNNECESSARY HERE, THERE ARE NO SCOPE PROPS
        controller: 'childCtrl',
        controllerAs: 'child',
        template: '<p>{{ child.greeting.hello }}</p>', // PREFIX WITH VALUE
                                                       // OF `controllerAs`
        require: ['myChild', '^myParent'],
        link: function(scope, elem, attrs, ctrls) {
            var myChild = ctrls[0], myParent = ctrls[1];
            myChild.greeting = myParent.greeting;
        }
    }
});

指令（'myChild'，函数（）{ 返回{ 范围：{ //问候语：'='//不需要此项；从父级使用 }, bindToController:true，//这里不需要，没有范围道具 控制器：“childCtrl”， controllerAs:“孩子”， 模板：“{{child.greeting.hello}

”，//带值的前缀 //控制者` 要求：['myChild'，'^myParent']， 链接：功能（范围、要素、属性、ctrls）{ var myChild=ctrls[0]，myParent=ctrls[1]； myChild.greeting=myParent.greeting； } } });

---

我发现可以使用元素属性将属性从父指令控制器的作用域传递给子指令控制器

function parentCtrl () {
  this.greeting = 'Hello world!';
}

function myParentDirective () {
  return {
    scope: {},
    controller: 'parentCtrl',
    controllerAs: 'ctrl',
    template: '<my-child greeting="ctrl.greeting"></my-child>'
  }
}

function childCtrl () {}

function myChildDirective () {
  return {
    scope: {
      greeting: '='
    },
    bindToController: true,
    controller: 'childCtrl',
    controllerAs: 'ctrl',
    template: '<p>{{ ctrl.greeting }}</p><input ng-model="ctrl.greeting" />'
  }
}

angular.module('parent', [])
  .controller('parentCtrl', parentCtrl)
  .directive('myParent', myParentDirective);

angular.module('child', [])
  .controller('childCtrl', childCtrl)
  .directive('myChild', myChildDirective);

angular.module('app', ['parent', 'child']);

函数parentCtrl（）{
this.greeting='Hello world！'；
}
函数myParentDirective（）{
返回{
作用域：{}，
控制器：“parentCtrl”，
controllerAs:'ctrl'，
模板：“”
}
}
函数childCtrl（）{}
函数myChildDirective（）{
返回{
范围：{
问候语：'='
},
bindToController：对，
控制器：“childCtrl”，
controllerAs:'ctrl'，
模板：'{{ctrl.greeting}}
'
}
}
角度模块（'父'，[]））
.controller（'parentCtrl'，parentCtrl）
.指令（“myParent”，myParentDirective）；
angular.module（'child'，[]）
.controller（'childCtrl'，childCtrl）
.指令（“我的孩子”，我的孩子指令）；
模块（'app'，['parent'，'child']）；