2017-07-14 22 views
0

我想为jQuery创建自定义的角度下拉列表,并且在调用jQuery .val(newValue)后无法更新角度模型。为什么我使用jQuery?因为在一些页面中,我有几个下拉菜单,大约有500个元素,纯角度渲染的效果非常慢。这是指导我的链接功能:JQuery与angularjs ng-model的集成

(scope, element) => { 
    const parent = $(element); 
    const field = parent.find('input'); 
    const list = parent.find('ul'); 
    scope.options.map(item => list.append(
    $('<li>') 
     .text(item.text) 
     .addClass(item.disabled && 'disabled') 
     .data({ 
     value: item.value, 
     disabled: item.disabled 
     }) 
     .click(function() { 
     const data = $(this).data(); 
     if (!data.disabled) { 
      field 
      .val(data.value) 
      .trigger('change'); 
      // also tried => scope.model = data.value; 
     } 
     }) 
)); 
} 

这是模板:

<div class="dropdown"> 
    <input 
    type="text" 
    readonly 
    placeholder="Select item" 
    ng-model="model" 
    ng-change="change"> 
    <ul></ul> 
</div> 

这里的计算器我发现应该是.trigger('change')叫,但它不利于角度改变模式。我怎样才能更新角模型?

+2

谁愿意下使用一滴在它500个值? – Jorg

回答

0

我找到答案

scope.$parent.$apply(() => { 
    scope.model = data.value; 
}); 

而不是

field 
    .val(data.value) 
    .trigger('change');