Question

我有一个使用transclude功能的父组件。在其包含的部分中，默认情况下有子组件：

ex_price = $(".grid_val").html();

的index.html：

     export class ParentController {

               // some logic here
            }

            angular.module('dmp').component('parentObject', {
                bindings: {

                },
                controller: ParentController,
                transclude: true,
                templateUrl: 'test/parent.html'
            });
    }



    export class ChildController {



    }

    angular.module('dmp').component('childObject', {
        bindings: {

        },
        require: {
            parentCtrl: '^parentObject'
        },
        controller: ChildController,
        templateUrl: 'test/child.html'
    });
}

parent.html

<parent-object>

</parent-object>

请注意<div ng-transclude> <child-object></child-object> </div>位于父对象的转换部分

我收到以下错误：

<child-object>

如果我这样做它按预期工作，但这不是我的情况。

Controller 'parentObject', required by directive 'childObject', can't be found!

由于

编辑与gyc评论有关。

如果我理解正确，我可以删除<parent-object> <child-object></child-object> </parent-object>部分，只使用子对象而不进行翻译。这没关系，但我想稍后说：

<div ng-transclude>

然后<parent-object> <some-other-object></some-other-object> </parent-Object>将被<child-object>取代。如果我不使用翻译，则不会发生<some-other-object>。

Answer 1

尝试在childObject定义中更改此内容

require: {
    parentController: '^parentObject'
}

可能parentCtrl不是parentController

的已定义别名

Answer 2

camelcased组件以短划线分隔为dom-elements，所以它看起来像这样：

angular.module('dmp').component('childObject', {
    bindings: {

    },
    require: {
        parentCtrl: '^parent-object'
    },
    controller: ChildController,
    templateUrl: 'test/child.html'
});

transcluded组件无法访问其父级所需的控制器

2 个答案: