【发布时间】：2016-12-24 01:27:35
【问题描述】：
我试图将一个值从一个父组件传递给他的嵌套子组件，角度为1.5
该值可以从父母那里更新，但孩子不能编辑它，只是显示它。那么单向绑定'对吗？
而且我不能在父组件声明中直接传递子组件，因为父组件也会有其他用途。
关键是我的父组件存储了公共数据，但是它们 孩子们会以不同的方式使用它。
并且父组件会被多次使用，不同的 孩子，这就是为什么我不能通过父母里面的孩子 宣言。为了自动更新，我需要绑定信息，当 父母更新数据，必须由孩子反映
HTML
<parent-component ng-transclude>
<child-component name="$ctrl.characters.arya"></child-component>
<child-component name="$ctrl.characters.john"></child-component>
</parent-component>
JS
// Parent Component declaration
// /////////////////////////
(function() {
'use strict';
angular
.module('app')
.component("parentComponent", {
transclude: true,
controller: "ParentComponentController",
template:
'<div class="parent-c"></div>'
});
})();
// Parent Component Controller
// /////////////////////////
(function() {
'use strict';
angular
.module('app')
.controller('ParentComponentController', ParentComponentController);
function ParentComponentController() {
var $ctrl = this;
$ctrl.characters = {};
$ctrl.characters.arya = "Arya Stark";
$ctrl.characters.john = "John Snow";
}
})();
//CHILD Component declaration
// /////////////////////////
(function() {
'use strict';
angular
.module('app')
.component("childComponent", {
bindings: {
name: '<'
},
controller: "ChildComponentController",
template:
'<div class="child-c"' +
'<h3>Im a child Component</h3>' +
'<p><strong>Name: </strong>{{$ctrl.name}}</p>' +
'</div>'
});
})();
// CHILD Component Controller
// /////////////////////////
(function() {
'use strict';
angular
.module('app')
.controller('ChildComponentController', ChildComponentController);
function ChildComponentController() {
var $ctrl = this;
}
})();
Check the WORKING SAMPLE on plunkr
require 属性用于组件通信，但我尝试使用它但没有成功:(，这里需要一点亮点。
【问题讨论】：
-
您想将名称作为属性传递给组件（通过绑定）还是通过从父级继承（通过 require）？
标签： angularjs inheritance angularjs-1.5 angular-components