Oracle JET:将异步 属性 传递给复合

Oracle JET: Passing asynchronous property to composite

我想像这样将一个数组(或 observableArray)传递给一个组合:

<add-training-modal id="modal" employees="[[data]]"></add-training-modal>

data 通过异步调用在关联的 viewModel 中检索:

self.data = ko.observableArray();
UserFactory.getUsers().then(arr => {
    self.data(arr);
})

问题:[[data]] 在异步调用完成之前传递给了复合体。只要更新组合中的 data 就可以了。然而,事实并非如此。

在复合视图模型中:

function model(context) {
    //...
    context.props.then(function (propertyMap) {
        self.properties = propertyMap;
        console.log(propertyMap.employees); // is empty []

        setTimeout(function () {
            console.log(propertyMap.employees); // is full [...]
        }, 500);
    });
}

model.prototype.attached = function(context) {
   context.props.then(function (propertyMap) {
       console.log(propertyMap.employees); // is empty []
   });
};    

我知道我可以从复合材料中检索数据。但这不是根本问题的答案。

换句话说,复合体需要监听变化事件,对吗?添加此代码:

self.composite = context.element;
$(self.composite).on('employees-changed', function (event) {
    if (event.detail.updatedFrom === 'external') {
        console.log(event.detail.value);
    }
});

在最新版本中(我自己还没有测试过):

model.prototype.attached = function(context) {
    self.composite = context.element;
    self.composite.addEventListener('employeesChanged',function(event){
        if (event.detail.updatedFrom === 'external'){
            console.log(event.detail.value);
        }
    });
};

有关更多信息,请查看此博客:https://blogs.oracle.com/groundside/jet-composite-components-v-events

这是有关 Oracle-JET 组合的权威指南。

Ray 的回答很有用。

还有另一种解决方案。它需要 2018 年 4 月 16 日发布的 JET v5.0.0+。它带有一个新的 composite lifecycle method,称为 propertyChanged(context)。你可以这样使用它:

model.prototype.propertyChanged = function(context){
    if (context.property === 'employees') {
        this.employees(context.value);  
    }
};

(升级到 v5.0.0 时注意 this issue。)