如何刷新自举选的选项从AJAX API

我已创建奥里利亚自定义负载数据后，属性代码如下如何刷新自举选的选项从AJAX API

@customAttribute('bt-select') 
@inject(Element) 
export class BootstrapSelect { 
    @bindable val; 
    @bindable list; 

    constructor(element) { 
    this.element = element; 

    } 

    attached() { 
    $(this.element).selectpicker(); 
    } 

    valChanged(newValue, oldValue) { 
     $(this.element).selectpicker("val",_.isObject(newValue)?newValue.id:newValue); 
    } 

    listChanged(newValue, oldValue) { 
    setTimeout(()=>{ 
     $(this.element).selectpicker("refresh"); 
    },300) 
    } 

    detached(){ 
    this.val = null; 
    this.list = null; 
    $(this.element).selectpicker("destroy"); 
    } 

}

，并用它作为下面从

<select value.bind="form.category" data-width="100" 
           bt-select="val.bind:form.category;list.bind:categorys;"> 
          <option value="">select:category</option> 
          <option repeat.for="category of categorys" 
            value="${category.id}"> 
          ${category.name} 
          </option> 
         </select>

选择的选项标签重复类别道具类别，this.categorys loda ajax api数据，它是异步步骤呈现选择选项标记，我必须添加setTimeout func listChanged方法等待aurelia呈现select的选项标记com然后强制刷新引导选择组件

我觉得它不好，但我没有更好的方法来解决它，我知道许多jQuery插件应该使用完成的DOM元素并呈现它们，但在aurelia框架中附加（）方法，异步api的一些数据加载是否有一些后处理方法或异步数据绑定到dom后要调用的事件

来源

2017-09-15 date13

您可以排队一个微任务，确保您的函数将在更新后运行DOM。例如：

//... 
import { TaskQueue } from 'aurelia-task-queue'; 

@inject(Element, TaskQueue) 
export class BootstrapSelect { 
    //... 
    constructor(element, taskQueue) { 
    this.element = element; 
    this.taskQueue = taskQueue; 
    } 

    listChanged(newValue, oldValue) { 
    // at this point, a micro-task for updating the dom is already queued. 
    // now, you should queue a new task that will run after the previous one is completed. 
    this.taskQueue.queueMicroTask(() => { 
     $(this.element).selectpicker("refresh"); 
    }); 
    } 
}

类似的问题：@bindable changeHandler fires before bindings are done updating

希望这有助于！

来源

2017-09-15 13:18:06

thx为您的帮助，经过一些测试后，我发现这不起作用，但我使用this.taskQueue.queueTask获得与我想要的相同的效果，阅读文章后https://ilikekillnerds.com/2016/ 02/working-with-the-aurelia-task-queue /我只知道queueMicroTask在queueTask之前运行，而且我在我的项目中测试过很多情况，有些工作，有些不在使用queueMicroTask时，是否还有一些关于这些细节的更多细节两种方法。 thx非常多 – date13

答案应该有效......可能还有其他影响你的代码的东西 –

如何刷新自举选的选项从AJAX API

回答

相关问题