Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[BUG] Extends Components inputs and disabledLifeCycleHooks #505

Closed
Chazing opened this issue Mar 12, 2018 · 5 comments
Closed

[BUG] Extends Components inputs and disabledLifeCycleHooks #505

Chazing opened this issue Mar 12, 2018 · 5 comments

Comments

@Chazing
Copy link

Chazing commented Mar 12, 2018

Overview of the issue

Hi
Thank you for adding a flat document option in the case of a component that inherits a base class.
We have some problems with this:

  1. Inputs from base class are not documented in components nor in baseClass

  2. The disableLifeCycleHooks option does not work on base class. there are LifeCycleHooks functions in the base class, and even when i use disabledLifeCycleHooks option, the functions are still visible in the child component and base class.

  3. Inheritance functions from external libraries such as Angular are also documented. For example, the base class extends Angular's ValueAccessorBase. in the documentations apear ValueAccessorBase functions.
    If the class is not in my code, I do not need to flat its functions

Many thanks for the amazing project!

Operating System, Node.js, npm, compodoc version(s)

"@compodoc/compodoc": "^1.0.9"
node v8.9.4

Angular configuration, a package.json file in the root folder

"doc:build": "compodoc -p src/tsconfig.app.json",
"doc:serve": "compodoc -s",
"doc:buildandserve": "compodoc -p tsconfig.documentation.json -a screenshots -y doc-styles/ -s --includes markdown --hideGenerator --disableGraph --disableCoverage --disableSourceCode --disablePrivate --disableProtected --disableInternal --disableLifeCycleHooks"

Compodoc installed globally or locally ?

locally

Motivation for or Use Case

I need a flat documentation of components for usage. which can see on one page everything that needs to be done to use the component. (selector, inputs, outputs) and I don't need to describe the code. Any additional things that is in the code for internal use and those who use Componente does not need is unnecessary for me.

Reproduce the error
  • defined base class:
import { Observable } from 'rxjs/Observable';
import { ValueAccessorBase } from './value-accessor.base';

export abstract class ElementBase<T> extends ValueAccessorBase implements OnInit, OnDestroy {
    @Input() disabled: boolean;
    @Input() required: boolean;
    @Input() labelTextKey: string = "";

    @Output()
    focus = new EventEmitter();
    @Output()
    blur = new EventEmitter();

    private getGroupColWidth() {
        return this.isLabelAboveControl ? 'col-sm-' + this.controlWidthColumns : '';
    }

    constructor(protected el: ElementRef, protected _injector: Injector) {
        super();
    }

    ngOnInit() {
    }

    ngOnDestroy() {
    }

    protected onFocusIn($event?: any) {
        this.focus.emit(event);
    }

    protected onBlur($event?: any) {
        this.blur.emit(event);
    }
}
  • Define chiled component:
import { Component, ElementRef, forwardRef, Injector, Input } from '@angular/core';
import { NG_VALUE_ACCESSOR } from '@angular/forms';
import { ElementBase } from "../base/element.base";

@Component({
    selector: 'my-textbox',
    templateUrl: 'my-textbox.component.html',
    providers: [{
        provide: NG_VALUE_ACCESSOR,
        useExisting: forwardRef(() => MyTextboxComponent),
        multi: true
    }]
})
export class MyTextboxComponent extends ElementBase<string> {
    @Input() placeholder: string = '';
    @Input() inputType: string = '';
    
    constructor(el: ElementRef, _injector: Injector) {
        super(el, _injector);
    }

    change(event) {
    }

    onFocusIn($event?: any) {
        $event.target.select();
        super.onFocusIn($event);
    }
}

then run: npm run doc:buildandserve

I would be grateful if you would treat.

@Chazing Chazing changed the title [Bug] with inherits inputs [Bug] Extends Components inputs and disabledLifeCycleHooks Mar 12, 2018
@vogloblinsky vogloblinsky added this to the 1.1.0 milestone Mar 12, 2018
@vogloblinsky vogloblinsky changed the title [Bug] Extends Components inputs and disabledLifeCycleHooks [BUG] Extends Components inputs and disabledLifeCycleHooks Mar 12, 2018
@vogloblinsky
Copy link
Contributor

vogloblinsky commented Mar 19, 2018

Ok your issue is about the inheritance of a component with a class (without @component decorator). I will ad this scenario in the tool.
The other ones are managed : component <- component, class <- class

@vogloblinsky
Copy link
Contributor

@Chazing can i have the code of value-accessor.base.ts file ?

@vogloblinsky
Copy link
Contributor

Fixed for the first 2 points. Waiting informations for inheritance functions from external libraries issue.

@vogloblinsky vogloblinsky modified the milestones: 1.1.0, 1.1.1 Mar 23, 2018
@vogloblinsky vogloblinsky modified the milestones: 1.1.1, 1.1.2 Mar 30, 2018
@vogloblinsky vogloblinsky modified the milestones: 1.1.2, 1.1.3 Apr 9, 2018
@vogloblinsky vogloblinsky modified the milestones: 1.1.3, 1.1.4 Apr 22, 2018
@Chazing
Copy link
Author

Chazing commented Apr 23, 2018

It works great! thanks

@Chazing Chazing closed this as completed Apr 23, 2018
@vogloblinsky vogloblinsky modified the milestones: 1.1.4, 1.1.3 Apr 23, 2018
@lock
Copy link

lock bot commented Sep 30, 2019

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem. Why locking ? Having issues with the most up-to-date context.

@lock lock bot locked as resolved and limited conversation to collaborators Sep 30, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

2 participants