我正在使用Angular 1.2和bootstrap 3.x,并尝试使用angular-bootstrap插件折叠DIV。我有带有搜索栏的表单,该表单使用我的自定义$ resource服务从控制器中的服务器检索特定数据:
$scope.sendSearch = function(query) {
$scope.results = Search.query(query);
};
而且,在使用以下代码检索结果后,我想取消折叠结果:
<div collapse="isCollapsed">
<li class="well" ng-repeat="result in results" style="list-style-type: none;">
</li>
</div>
在添加带有正确ng-click动作的简单按钮以检索数据后,我能够这样做,但是我的问题是-是否可以在控制器中更改“ isCollapsed”变量的值?我知道,由于响应的“承诺”性质,因此可能会出现问题。当我尝试这样做时,我的div被class =“ collapsing”冻结了,没有任何反应,但是-我仍然能够使用前面提到的按钮折叠/取消折叠div,该按钮也固定了class属性。
最佳答案
只需创建一个示波器观察器,以查看结果是否已更改或已检索。
$scope.watch("results", function(newValue, oldValue){
if (newValue.length > 0)
$scope.isCollapsed = !$scope.isCollapsed;
})
要么
$scope.watch("results", function(newValue, oldValue){
if (_.isEqual(newValue, oldValue) ) // I used underscorejs
$scope.isCollapsed = !$scope.isCollapsed;
})