微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

javascript – Angular 1.5嵌套组件绑定父值

我是 angularjs的新手.我正在尝试使用angular 1.5嵌套组件.我可以绑定子组件中的父组件属性.

例如:

<div ng-app='cbsApp' ng-controller='cbsCnt as ct'>
    <cbs-cus-comp com-bind='ct.name'>
        <child child-com-bind='cbsCusCompCntAs.name'></child>
    </cbs-cus-comp>
</div>

我可以在com-bind中获得ct.name值.但无法在child-com-bind中获取cbsCusCompCntAs.name. (cbsCusCompCntAs是cbs-cus-comp控制器)

Working Plunker:https://plnkr.co/edit/axQwTn?p=preview

提前致谢.

解决方法

在第一种情况下,您通过controllerAs直接引用控制器范围.

在角度1.5中使用组件时,您可以通过require获取父组件,这将使$onInit之后的父级属性可用于Components Documentation

Note that the required controllers will not be available during the
instantiation of the controller,but they are guaranteed to be
available just before the $onInit method is executed!

在您的特定情况下,您可以更新子组件以要求父组件:

var child = {
    require     :  {parentComp:'^cbsCusComp'},template    :  'Child : <b{{cbsCusChildCompCntAs.childComBind}}</b>',controller  :  cbsCusChildCompCnt,controllerAs:  'cbsCusChildCompCntAs'
    };

和它的控制器来获取你需要的数据(我使用相同的名称,只是为了看它工作):

function cbsCusChildCompCnt(){
  this.$onInit = function() {
    this.childComBind = this.parentComp.name;
  };
}

更新的plunker是here.

原文地址:https://www.jb51.cc/js/159677.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐