更新Angular child 1.5组件不工作
更新Angular child 1.5组件不工作
提问于 2017-07-16 16:00:17
我正在使用一个Angular 1.5组件来构建以下结构：
<parent>
<child active="model.active">
<child active="model.active">
<child active="model.active">
</parent>我的组件：
(function() {
'use strict'
angular.module('module').component('child',
{
templateUrl: 'template.html',
bindings: {
active: '<'
},
controllerAs: 'model',
controller: function() {
var model = this;
model.select = function() {
model.deselectAllChildren()(model);
model.active = true;
};
}
});
})();父deselectAllChildren方法：
model.deselectAllChildren = function(tabModel) {
model.active = false;
};当用户选择其中一个子组件时，我希望它处于活动状态，而其他子组件处于非活动状态。因此，该逻辑使所有子项都处于非活动状态(以清除先前的选择)，然后使选定的子项处于活动状态。默认情况下，父级的model.active属性为false。这对于第一个select很有效，但是后续的select不起作用，因为之前选择的子组件不会取消选择，因为model.active = false更改不会传播到子组件(因为父组件的model.active值仍然是false -但是一些子组件的model.active等于true。这无疑是一个作用域/绑定问题；我觉得我需要强制将model.active = false下推到所有子级。有什么想法吗？
回答 1
Stack Overflow用户
发布于 2017-07-17 05:27:04
这样如何：
<parent>
<child active="model.active === 0" on-select="model.active=0">
<child active="model.active === 1" on-select="model.active=1">
<child active="model.active === 2" on-select="model.active=2">
</parent>angular.module('module').component('child',
{
templateUrl: 'template.html',
bindings: {
active: '<',
onSelect: '&'
},
controllerAs: 'model',
controller: function() {
var model = this;
model.select = function() {
model.onSelect();
};
}
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/45126347
复制相关文章
相似问题
腾讯云开发者
