在AngularJS 1.5中的包含内访问组件的$ scope [英] Access $scope of Component within Transclusion in AngularJS 1.5

问题描述

如何使该组件的$ scope在该组件的包含区域内可访问？下面是一个示例：

How can I make the $scope of a component accessable within transclusion area of that component? here an example:

<test>
   {{myVar}}
</test>    

.component('test', {
    transclude:true,
    template:'<ng-transclude></ng-transclude>',
    controller:function($scope){

        this.$onInit = function() {
                        $scope.myVar = 1123


        }
    }
})

推荐答案

您可以使用 $ parent 来访问隔离的组件范围，例如：

You may use $parent to access isolated component scope, e.g.:

<test>
    {{ $parent.$ctrl.myVar }}
</test>

.component('test', {
    transclude: true,
    template: '<ng-transclude></ng-transclude>',
    controller: function($scope) {
        var ctrl = this;

        this.$onInit = function() {
           ctrl.myVar = 1123;
        }
    }
})

否则，您可以定义专用的插入时隙：

Or else you may define dedicated transclusion slot:

<test>
    <some-fancy-slot>
        {{ $parent.$ctrl.myVar }}
    </some-fancy-slot>
</test>

.component('test', {
    transclude: {
        slot: 'someFancySlot'
    },
    template: '<div ng-transclude='slot'></div>',
    controller: ...
})

这篇关于在AngularJS 1.5中的包含内访问组件的$ scope的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！