I've written a directive in angular that disables or enables a button after validating an object. But the button also has some other simple validation requirements which are directly supplied to the "disabled" directive as value. Example code html:

<button (click)="onSave()"
    [disabled]="validation1() || !validation2()"
    [validProperty]="myObject.property">Save</button>

This is my directive:

import { Directive, Input, OnChanges, HostBinding } from '@angular/core';
import { SomeType } from '../../types/data.types';

@Directive({
    selector: '[validProperty]'
})
export class ValidateDirective implements OnChanges {

    @HostBinding('disabled') disabled: boolean;
    @Input('validProperty') property: SomeType[];

    constructor() {
    }

    ngOnChanges() {
        this.disabled = !this.validateProperty(this.property);
    }

    private validateProperty(property: SomeType[]): boolean {
        return false;
    }
}

Currently, my button only considers validations submitted to [disabled] and not my directive, eventhough control reaches my directive(I've used devtools breakpoints to check). How do i make it consider both [disabled] validations and my directive hostbinding? Kindof like an or operator. Thanks for help in advance :)