使用 Angular 1.5 - 您可以在另一个组件的模板中拥有一个组件吗？

Question

Angular 1.5的新手，并试图更好地理解组件通信。想知道我是否可以将一个组件放在另一个组件的模板中？如果是这样，它们如何相互通信(使用require？

Answer 1

是的。每个组件都有输入和输出。输入是从父级到子级，而输出是从子级到父级。在此 plunker 示例中，实际值增量是在父组件的控制器中完成的，但该值显示在子组件中，其中增量按钮位于子组件中。

.component('parentComponent', {
template: '<child-component value="$ctrl.value" on-increment="$ctrl.increment()"></child-component>',
controller: function() {
// Init
var self = this;
self.$onInit = function() {
//
}
self.value = 7;
// Increment
self.increment = function() {
return self.value += 1;
}
},
bindings: {
//
}
})
.component('childComponent', {
template: '<h2 ng-bind="$ctrl.value"></h2><button ng-click="$ctrl.onIncrement()">Increment Value</button>',
controller: function() {},
bindings: {
value: '<',
onIncrement: '&'
}
});