Question

我遇到以下问题：

<input 
    type = "text" 
    class = "class1 class2" 
    placeholder = "Type here..." 
    autocomplete = "off" 
    ng-model = "searchKeyword" 
    name = "searchId"
    ng-class = "{'my-class1': myObject.myAttribute,'my-class2': myObject.myFunction()}" //<-- HERE IS THE PROBLEM
    ng-disabled = "myObject.myFunction()"
    ng-change = "searchConditionChanged()" numbers-only />

大部分时间myObject.myFunction()都会返回false，但会有一段短暂的时间返回true。

在我的网页上，我可以看到正确地将"my-class2"类添加到<input>，但在此之后，当myObject.myFunction()再次返回false时，应删除该类。

但问题是为什么添加了“my-class2”类，但删除了 NOT 。当我看到函数在console.log()中返回false时，该类仍在DOM树中。

即使我使用$scope.$apply()或$scope.$digest()强制更新，它也不会改变。

类“my-class1”绑定到myObject.myAttribute。它有同样的问题。

让我感到困惑的其他事情是，当myObject.myFunction()返回true时会持续一段时间（如500ms），ng-class总是正确设置类。

感谢任何帮助！

Answer 1

我猜问题是如何编写代码，粘贴控制器或方法的最佳方法; 我认为这可能会导致这个问题：

在你的代码中，你只在开始时间表演我的班级，然后从不行动;
你的代码可能很复杂，所以这段时间太长了;
您更改了值但未绑定到视图;

我的例子很顺利

＆＃13;

		var app = angular.module('myApp', []).controller('haha', function ($scope, $timeout) {
			$scope.user = {
				name: 'admin'
			};
			$timeout(function loop() {
					if ($scope.user.name) {
						$scope.user.name = '';
						console.log($scope.user.name);
					} else {
						$scope.user.name = 'admin';
						console.log($scope.user.name);
					}
					$timeout(loop, 5)
				}, 5)
		})

＆＃13;

.r {
			color: red;
			font-size: 30px;
		}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="haha">
		<div ng-class="{'r':user.name}">{{user.name}}</div>
</div>

＆＃13;

如果快速切换，ng-class在绑定变量上运行不正常，这可能吗？

1 个答案: