ng-class

ngClass not working in my Angular Project

流过昼夜 提交于 2021-02-11 07:17:23
问题 I'm trying to make a form with validation, and I am using the following interface to define FieldError . export interface FieldError { errorAt: string; errorMessage: string; } In my component.html I am using [ngClass] to check if the FieldError.errorAt === 'first_name' I want to use text-danger and if not I want to use text-muted . It looks like following <div class="form-group text-left"> <label [ngClass]="{'text-danger':FieldError.errorAt==='first_name','text-muted':FieldError.errorAt!==

Add a Class when In a certain Route - Angular 2

本秂侑毒 提交于 2021-01-27 05:09:07
问题 I'm trying to add a class when Im on a certain route. The code is in my AppComponent, Im using ngClass. @Component({ selector: 'my-app', template: `<a [ngClass]="getRoute(router)"> // Some html code.... }) and then I have the function on the same app.component.ts export class AppComponent { getRoute(){ if (this.router.url === '/atendimento'){ return "hide-bar"; } } } The error I'm getting is the following one: Property 'router' does not exist on type 'AppComponent' And yes, I am importing

Add a Class when In a certain Route - Angular 2

≡放荡痞女 提交于 2021-01-27 05:08:36
问题 I'm trying to add a class when Im on a certain route. The code is in my AppComponent, Im using ngClass. @Component({ selector: 'my-app', template: `<a [ngClass]="getRoute(router)"> // Some html code.... }) and then I have the function on the same app.component.ts export class AppComponent { getRoute(){ if (this.router.url === '/atendimento'){ return "hide-bar"; } } } The error I'm getting is the following one: Property 'router' does not exist on type 'AppComponent' And yes, I am importing

Add a Class when In a certain Route - Angular 2

纵饮孤独 提交于 2021-01-27 05:08:06
问题 I'm trying to add a class when Im on a certain route. The code is in my AppComponent, Im using ngClass. @Component({ selector: 'my-app', template: `<a [ngClass]="getRoute(router)"> // Some html code.... }) and then I have the function on the same app.component.ts export class AppComponent { getRoute(){ if (this.router.url === '/atendimento'){ return "hide-bar"; } } } The error I'm getting is the following one: Property 'router' does not exist on type 'AppComponent' And yes, I am importing

Add a Class when In a certain Route - Angular 2

落花浮王杯 提交于 2021-01-27 05:08:05
问题 I'm trying to add a class when Im on a certain route. The code is in my AppComponent, Im using ngClass. @Component({ selector: 'my-app', template: `<a [ngClass]="getRoute(router)"> // Some html code.... }) and then I have the function on the same app.component.ts export class AppComponent { getRoute(){ if (this.router.url === '/atendimento'){ return "hide-bar"; } } } The error I'm getting is the following one: Property 'router' does not exist on type 'AppComponent' And yes, I am importing

Angular指令

别说谁变了你拦得住时间么 提交于 2020-03-05 16:48:43
ng-app定义应用程序的根元素 ng-bind绑定HTML元素到应用程序数据 ng-bind-html绑定HTML元素的innerHTML到应用程序数据并演出HTML字符串中危险字符 ng-bind-template规定使用模板替换的文本内容 ng-blur规定blur事件的行为 ng-change规定在内容改变时要执行的表达式 ng-checked规定元素是否被选中 ng-class指定HTML元素使用的css类 ng-class-even类似ng-class但只在偶数行起作用 ng-class-odd类似ng-class但只在基数行起作用 ng-click定义元素被点击时的行为 ng-cloak在应用正要加载时防止其闪烁 ng-controller定义应用的控制器对象 ng-copy规定拷贝事件的行为 ng-cut规定剪切事件的行为 ng-dblclick规定双击事件的行为 ng-disabled规定一个元素是否被禁用 ng-focus规定聚焦事件的行为 ng-form指定HTML表单继承控制器表单 ng-hide隐藏或显示HTML元素 ng-href为the<a>元素指定链接 ng-if如果条件是FALSE移除HTML元素 ng-include在应用中包含HTML文件 ng-init定义应用的初始化值 ng-keydown规定按下键事件的行为 ng

Angular [ngClass] directive not working on scroll event

会有一股神秘感。 提交于 2020-02-03 01:30:19
问题 I'm using Angular 8 and bootstrap 4 to build a navbar which changes its color from transparent to dark when a certain amount to scroll happens. I'm using [ngClass] directive in order to achieve it. The function inside component.ts will return either true or false depending upon the scroll happened or not and ngClass will act accordingly. But I cannot unfortunately achieve it. Kindly take a look at my code below: HTML <nav class="navbar navbar-expand-lg fixed-top navbar-transparent" [ngClass]=

Angular [ngClass] directive not working on scroll event

♀尐吖头ヾ 提交于 2020-02-03 01:30:12
问题 I'm using Angular 8 and bootstrap 4 to build a navbar which changes its color from transparent to dark when a certain amount to scroll happens. I'm using [ngClass] directive in order to achieve it. The function inside component.ts will return either true or false depending upon the scroll happened or not and ngClass will act accordingly. But I cannot unfortunately achieve it. Kindly take a look at my code below: HTML <nav class="navbar navbar-expand-lg fixed-top navbar-transparent" [ngClass]=

Angular 2 ngClass function

蓝咒 提交于 2020-01-24 12:58:07
问题 Hi I was in the midst of creating a wizard/step component. How can I use the ngClass to return css classes based on -> ? I have 5 steps, let's say the user is in the 3rd step. All the previous steps should return a css class named active and the current step (step 3) returns css class active and all the steps after step 3 should return inactive css class. <div class="step actived"> <span [ngClass]="displayActiveness()">Step 1 </span> </div> <div class="divider"></div> <div class="step"

Assign classes conditionally in Angular2 [duplicate]

江枫思渺然 提交于 2020-01-10 22:05:35
问题 This question already has answers here : Angular: conditional class with *ngClass (16 answers) Closed 2 years ago . I'm trying to conditionally assign a class to a div based on the value I obtained from my back-end system. Say there is an object 'A' which has a variable status which possibly has values status1 and status2 . I'm trying to assign 2 classes ( class1 and class2 ) conditionally depending on the status using Angular 2. Following is the condition I'm using. Please suggest a working