vendredi 14 décembre 2018

Angular Conditional from Mock Array Object

I'm not sure how to get an array object and pass it into a conditional (if I am stating this wrong, feel free to edit the title and question :).

This is what I am attempting; See calculateClasses() below:

In the component:

import { Component, OnInit } from '@angular/core'; import { AIRFRAMES } from './mock-airframe-list'

@Component({
  selector: 'app-airframe-list',
  templateUrl: './airframe-list.component.html',
  styleUrls: ['./airframe-list.component.scss']
}}

export class AirframeListComponent implements OnInit {

  fabIcon = 'plus';
  fabLink = '/inventory/add-airframe';

  airframes = AIRFRAMES;

     calculateClasses() {
       if(airframe.airframeStatus === 'airworthy') {
         return {
           'green': true
       } else if (...){. . .};
    }
  }

  ngOnInit() {}
}

In the mock-airframe-list Data:

import { Airframe } from '@app/modules/inventory/airframes/pages/airframe-list/airframe';

export const AIRFRAMES: Airframe[] = [
  {
    airframeStatus: 'airworthy'
  },
  {
    airframeStatus: 'maintenance'
  },
  {
    airframeStatus: 'unairworthy'
  },
];

In the airframe class:

export class Airframe {
  airframeName: string;
  airframeModel: string;
  airframeHours: number;
  airframeFlights: number;
  airframeType: string;
  airframeSN: string;
  airframeStatus: string;
}

...and the

<button
  mat-mini-fab
  [ngClass]="calculateClasses()" >
  <fa-icon
    icon="plane-departure"
    class="airframe-card-fab-icon" >
  </fa-icon>
</button>

Any help to educate me here is greatly appreciated.

Aucun commentaire:

Enregistrer un commentaire