在AngularJS 1.5中访问子组件中的父组件属性的方法是什么？答案

【问题标题】：What is way to access parent component property in child component in AngularJS 1.5?在AngularJS 1.5中访问子组件中的父组件属性的方法是什么？
【发布时间】：2017-06-01 10:37:37
【问题描述】：

我有父组件和子组件，并且有一些元素可以使用<ng-if> by isTrue 属性值隐藏和显示。但目前，做同样的事情面临麻烦。

具体场景：

我在父组件控制器中有一个名为“isTrue”的属性，并使用isTrue: '<' 将其传递给子组件。现在，在子组件中，我需要使用 isTrue 属性值隐藏一些我没有问题的东西。

现在。再次循环重复相同但这次我想再次使用isTrueCheck() 硬重置父组件中的isTrue 并再次发送回子组件。现在，isTrue 应该设置为 true 并将其发送到子组件。

夏天：

同样，每当我调用 isTrueCheck() 时，我只想将 'isTrue' 设置为 true 并将其发送到子组件。

我已尝试将其设置为$onInit()。

父控制器：

this.isTrue;
this.isTrueCHeck = function(){
    isTrue = true;
};

儿童控制器：

isTrue: '<'
if (isTrue){
   isTrue= false;
}

子 HTML/模板

<div ng-click="isTrueCheck"></div>// Calling to reset `isTrue` property
<div ng-if="$ctrl.isTrue">ele1</div>
<div ng-if="!$ctrl.isTrue">ele2</div>

现在，我想调用父控制器并将其硬重置为 true 并执行相同的过程。

【问题讨论】：

标签： angularjs

【解决方案1】：

我不确定我是否理解您的问题。如果我说：

您有一个父组件和一些子组件
您在父项中设置了一个变量“isTrue”，并希望在子项中传播它。当父级中的“isTrue”发生变化时，您希望在子级中触发它。

好吧，如果是这样，你需要在孩子中实现 $onChange 方法：

isTrue: '<'

上面的一个是你从父级传递的变量。

//
// React to changes of *one-way bindings* (< and @) of a component
// see http://blog.thoughtram.io/angularjs/2016/03/29/exploring-angular-1.5-lifecycle-hooks.html
// see https://toddmotto.com/angular-1-5-lifecycle-hooks#onchanges
ctrl.$onChanges = function (changesObj) {
    // if isTrue changes, do something
    if (changesObj.isTrue && changesObj.isTrue.currentValue) {
        // do something...
        // ....
    }
}

见：http://blog.thoughtram.io/angularjs/2016/03/29/exploring-angular-1.5-lifecycle-hooks.html

和

https://toddmotto.com/angular-1-5-lifecycle-hooks#onchanges

【讨论】：

【解决方案2】：

如果您的 HTML 如下所示，您可以执行以下操作：

<div ng-controller="ParentCtrl">
    <div ng-controller="ChildCtrl">
    </div>
</div>

然后就可以访问父作用域如下

function ChildCtrl($scope) {
    $scope.isTrue= $scope.$parent.isTrue;
}

如果您想从视图中访问父控制器，您必须执行以下操作：

<div ng-if="$parent.isTrue">ele1</div>
<div ng-if="!$parent.isTrue">ele2</div>

【讨论】：

他说的不是控制器。它谈论组件。 Angular 1.5+ 的一个新特性。组件没有 $scope 也没有 $parent。