如何在angular2中使用add class属性

Question

我的angularjs 2代码有问题。我想通过angular2应用这个css。

这里，我的jquery代码：

显示如何在角度2中使用此代码。我应该如何在角度2中使用属性add class。

请帮帮我。

Answer 1

不幸的是，到目前为止每个人都在给你Angular答案。当使用Angular2时，尽量不要使用jQuery。很少有jQuery应该直接使用的情况。

要有条件地将类添加到DOM元素，您需要向元素本身添加条件变量。

例如，如果您希望<input id="username" class="username">有条件地拥有slide1类，则可以将input元素更改为：

<input id="username" class="username [class.slide1]="myBoolean">

该布尔值可以通过click函数设置。要将点击事件添加到按钮，您将拥有<input type="button" (click)="myFunction()">。然后，您将在组件中定义一个名为myFunction（）的函数。 myFunction()会将this.myBoolean设置为true或false，这将切换slide1类。

请参阅here for how events (like click) in angular2 work和here for conditionally adding styles。

Answer 2

var app = angular.module('myApp',[]);
	app.controller('showCrtl',function($scope){
			$scope.addclass=function(event){
		      event.target.classList.add('colorClass');
      };
	});

.colorClass{
  background-color:red;
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="showCrtl">
  <input type="button" value="click" ng-click=addclass($event)>
</div>

请检查代码希望能帮到你

谢谢