材料下拉菜单，选择与搜索产生100％的CPU

我有以下的HTML代码材料下拉菜单，选择与搜索产生100％的CPU

<material-dropdown-select [buttonText]="organizer?.name" 
    [options]="filteredSailingClubs" 
    [itemRenderer]="displayNameRenderer"> 
    <div header> 
     <material-select-searchbox 
      label="Search..." 
      [filterable]="filteredSailingClubs"> 
     </material-select-searchbox> 
    </div> 
</material-dropdown-select>

及以下实施

var _list = [new SailingClub('123', 'Example1'), new SailingClub('456', 'Example2')]; 

final ItemRenderer<SailingClub> displayNameRenderer = (SailingClub item) => item.name; 

StringSelectionOptions<SailingClub> get filteredSailingClubs => new StringSelectionOptions(_list, toFilterableString: displayNameRenderer);

不幸的是，momemnt我打开一个页面，在这个内容浏览器的标签似乎产生100％的CPU负载，我不知道如何调试。

来源

2017-09-07 Fabian

当然，发布后，我立即发现错误。我正在重新生成get方法中的StringSelectionOptions。但现在我想知道。我的帆船俱乐部名单从外面改变（firebase），但我的例子只适用于一个静态列表，所以我会如何处理这个？ – Fabian

您可以使'filteredSailingClubs'成为一个字段，然后在更新'_list'时更新该字段。 –

感谢这个想法，我仍然没有看到这是如何工作的。我将filteredSailingClubs更改为在构造函数中初始化的字段。但是，这当然是更早，然后我的数据加载。我也可以通过firebase添加更多的SailingClubs，这只会更新商店中的列表，但不会更新我的字段。直到现在，我用ngFor迭代了这个列表，并且会自动处理更新。我现在怎么做？如果清单发生变化，我的店不会打电话给我，它不应该。 – Fabian

好吧，原因很简单。我正在重建列表中的每个访问权的OptionList：

StringSelectionOptions<SailingClub> get filteredSailingClubs => new StringSelectionOptions(_list, toFilterableString: displayNameRenderer);

它应该只构造一次，例如，在类的构造函数中。

来源

2017-09-09 07:39:55 Fabian

材料下拉菜单，选择与搜索产生100％的CPU

回答

相关问题