Question

我有一个如下所示的模态，它显示一个项目列表和一个文本字段，该文本字段根据'tmc.macrofilterpattern'中的值过滤列表'tmc.userMacrosListFiltered'中的项目。

<div id="listmodal" class="modal fade" role="dialog">
    <div class="modal-dialog" style="width: 350px;">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body" style=" height: 400px; width: 350px;overflow:scroll;">
                    <div id="macrolist" class="list-group" tabindex="0" >
                        <input type="text" id="filterby" class="form-control list-group-item" autocomplete="off" placeholder="type macro title here.." ng-model="tmc.macrofilterpattern" />
                        <a href="" class="list-group-item " ng-click="tmc.selectedMacro(item.macroTitle)" 
                        ng-repeat="item in tmc.userMacrosListFiltered" ng-if="item.macroTitle.toLowerCase().includes(tmc.macrofilterpattern.toLowerCase())">
                            {{item.macroTitle}}
                        </a>
                    </div>
            </div>
        </div>
    </div>
</div>

当我关闭模式时，我想清除列表并过滤文本。我正在清除以下内容，

$('#listmodal').on('hidden.bs.modal', function(){
    $('#macrolist').find('.active').removeClass('active');
    tmc.macrofilterpattern = "";
    tmc.userMacrosListFiltered = {};
});

在打开模态的给定触发器上，我用最新值填充tmc.userMacrosListFiltered列表，并假设将其显示为模态项列表。该列表将更新为最新值，但是，模式会在一段时间（5-10秒）内显示以前的值并使用“ tmc.userMacrosListFiltered”中的最新值刷新。

Answer 1

对于这个未回答的问题，我深表歉意，但我不敢发表评论。我认为问题是您将jquery与角度功能结合在一起。您应该看一下uibModal（https://angular-ui.github.io/bootstrap/）并尝试摆脱angular内的jquery版本。过去，我在像这样的Angular摘要中做事时遇到了一些问题。

从本质上讲，您可以创建一个模态组件/控制器，该组件/控制器将生活在有角度的世界中，并更加无缝地适合您的应用程序。它还可以确保每次打开模型时，控制器都会被参数重置并正确显示。

如果这不可行，则应查看$ apply https://docs.angularjs.org/api/ng/type/ $ rootScope.Scope＃$ apply来将您触发了jquery的代码转换为有角度的。

模态搜索过滤器不会清除ng-repeat列表，以前的结果仍然存在

1 个答案: