将数据绑定到GWT中的UI

Question

在Silverlight中，常用的模式是：

1. 请求数据
2. 取回数据的空容器
3. 异步启动查询以填充容器
4. 当查询返回时，在容器上激发一个事件
5. 根据容器的内容更新UI

这可以在GWT中完成吗？

我问这个问题的原因是，我正在尝试制作一个包含组名和图标列表的SuggestBox。首先，我查询Facebook以获得一个组ID列表，这些组ID接近SuggestBox中的当前String。然后，我启动查询以获取每个组id的图标。问题是，在完成这些查询之前，我必须返回建议。我不知道如何在获得数据后返回并插入数据。我不想在调用完成之前阻止，而且没有真正的方法提前知道要加载什么数据。

我可以为加载图像的建议返回一个小部件，但建议必须是一个纯字符串。

这里的正确方法是什么？

Answer 1

让我们假设您使用的是GWT RPC。您将有一些服务接口，可以获取建议的groupId和特定组id的图标。

public interface FacebookService extends RemoteService {
    List<String> getFacebookGroupIds(String suggestion);
    Icon getIconForGroup(String groupId);
}

您应该构建自己的Suggestion实现，该实现可以只显示groupId或groupId和Icon。

public class FacebookGroupSuggestion implements Suggestion {
    private String groupId;
    private Icon icon;
    public FacebookGroupSuggestion(String groupId) {
        this.groupId = groupId;
    }
    public String getDisplayString() {
        StringBuilder builder = new StringBuilder();
        builder.append("<b>");
        builder.append(this.groupId);
        builder.append("</b>");
        if (this.icon != null) {
            builder.append(this.icon.toSafeHtml());
        }
        return builder.toString();
    }
}

我使用Icon作为您自己的图标实现，它不是一个标准类。然后，您可以实现SuggestOracle来异步获取groupId和图标。SuggestOracle使用回调通知suggestBox对请求的某些响应可用。因此，获取结果，并在获得结果时调用回调。它会看起来像这样。

public class FacebookSuggestOracle extends SuggestOracle {
    private FacebookServiceAsync service = GWT.create(FacebookService.class);
    private Request currentRequest;
    private Callback currentCallback;
    @Override
    public void requestSuggestions(Request request, Callback callback) {
        // Save request & callback for future use.
        this.currentRequest = request;
        this.currentCallback = callback;
        // Fetch the groupIds
        service.getFacebookGroupIds(request.getQuery(), new AsyncCallback<List<String>>() {
            public void onSuccess(List<String> result) {
                createSuggestionsForGroupIds(result);
            }
        });
    }
    private void createSuggestionsForGroupIds(List<String> groupIds) {
        List<FacebookGroupSuggestion> suggestions = new ArrayList<FacebookGroupSuggestion>();
        for (String groupId : groupIds) {
            suggestions.add(new FacebookGroupSuggestion(groupId));
        }
        Response response = new Response(suggestions);
        // Tell the suggestBox to display some new suggestions
        currentCallback.onSuggestionsReady(currentRequest, response);
        // Fetch the icons
        for (String groupId : groupIds) {
            service.getIconForGroup(groupId, new AsyncCallback<Icon>() {
                public void onSuccess(Icon result) {
                    // match the icon to the groupId in the suggestion list
                    // use the callback again to tell the display to update itself
                }
            });
        }
    }
}