2012-04-25 18 views
7

Với Meteor, tôi muốn các mục mới được thêm vào danh sách mờ dần. Tuy nhiên, tôi không muốn mọi phần tử trong danh sách mờ dần khi một cái gì đó được thêm vào, chỉ có phần tử mới được thêm vào.Meteor cách gọi hàm js của khách hàng chỉ cho mục được thêm vào Bộ sưu tập

Tôi đã Collection sau được công bố bởi các máy chủ và đăng ký trên máy khách

List = new Meteor.Collection("List"); 


Meteor.autosubscribe(function() { 
    Meteor.subscribe('list'); 
}); 

Tôi có mẫu sau:

<template name="list"> 
    {{#each list}} 
    {{> list_item }} 
    {{/each}} 
</template> 

<template name"list_item"> 
    {{ text }} 
</template> 

Tôi muốn gọi sau khi một yếu tố mới là được chèn vào Bộ sưu tập:

function (item) { 
    var sel = '#' + item._id; 
    Meteor.defer(function() { 
    $(sel).fadeIn(); 
    }); 
} 

Tôi đã thử sử dụng

List.find().observe({ 
    added: function (list_item) { 
    var sel = '#' + list_item._id; 
    Meteor.defer(function() { 
     $(sel).fadeIn(); 
    }); 
    } 
}); 

Tuy nhiên, hàm được gọi cho mỗi mục trong danh sách khi một list_item mới được thêm vào, chứ không phải chỉ dành cho các mục mới duy nhất.

+0

tôi đã thấy điều này mà gợi ý quan sát: http://stackoverflow.com/questions/10274679/invoke-a-client-js-function-in-meteor-after-getting-results-from- the-server Tôi cũng thấy điều này: http://stackoverflow.com/questions/10109788/callback-after-the-dom-was-updated-in-meteor-js Tuy nhiên, với cả hai phương pháp, tất cả các yếu tố đều là đã bị mờ, thay vì chỉ phần tử được chèn cuối cùng. –

+0

Bạn đã tìm thấy giải pháp nào chưa? –

+0

Không, mặc dù tôi đã không thử trong tháng ... –

Trả lời

4

Tôi không chắc chắn bạn sẽ gọi trực tiếp cho Meteor.defer, tôi không thể tìm thấy nó trong tài liệu. Ngoài ra, các phiên bản sao băng của setTimeout và setInterval dường như không hoạt động bình thường và làm theo chỉ là một wrapper quanh Meteor.setTimeout(fn(), 0) Dù sao tôi nhận được những gì tôi nghĩ rằng bạn muốn làm việc:

html:

<body> 
    {{> list_items}} 
</body> 

<template name="list_items"> 
    <ul> 
    {{#each list_items}} 
     <li id="list-item-{{_id}}" style="display:none;"> 
     {{text}} 
     </li> 
    {{/each}} 
    </ul> 
</template> 

js:

List = new Meteor.Collection("List") 

if (Meteor.is_client) { 
    Meteor.subscribe("List") 

    Meteor.autosubscribe(function(){ 
    List.find().observe({ 
     added: function(item){ 
     setTimeout("$('#list-item-"+item._id+"').fadeIn('slow')",10) 
     } 
    }); 
    }); 

    Template.list_items.list_items = function(){ 
    return List.find() 
    } 
} 
+0

Cảm ơn, tôi sẽ cố gắng này và lấy lại cho bạn ... –

+0

Đã không làm việc cho tôi: ( –

Các vấn đề liên quan