Class method and property inheritance for components

[mspl13]

Description

This bug was originally reported over at the angular-cli repository (angular/angular-cli#7587). If you extend a class with an angular component annotation and reference class properties in the child's component html file, the linter will throw an error even though angular handles the inheritance perfectly fine and everything works as expected.

Steps to reproduce

1. Create a parent angular component and add some properties.
2. Create a child angular component that extends the one created in step 1.
3. Try to access the properties defined in the parent class inside the child's component html file.
4. Run the linter (e.g. using the angular-cli and the ng lint command).

Code example

A minimal example would probably look like this:

@Component({
  selector: 'app-parent-component'
})
export class ParentComponent {
  property: string;
}

@Component({
  selector: 'app-child-component',
  template: `<p [prop]="property"></p>`
})
export class ChildComponent extends ParentComponent { }

Error message

ERROR: /path/to/child.component.html[1, 1]: The property [PROPERTY_NAME] that you're trying to access does not exist in the class declaration.

Packages and versions

The package list contains the following, probably important packages and versions:

"@angular/cli": "^1.3.0",
"@angular/common": "^4.3.4",
"@angular/compiler": "^4.3.4",
"@angular/compiler-cli": "^4.3.4",
"@angular/core": "^4.3.4",
"@angular/forms": "^4.3.4",
"@angular/http": "^4.3.4",
"@angular/platform-browser": "^4.3.4",
"@angular/platform-browser-dynamic": "^4.3.4",
"@angular/router": "^4.3.4",
"@types/node": "^8.0.20",
"codelyzer": "^3.1.2",
"core-js": "^2.5.0",
"rxjs": "^5.4.3",
"ts-node": "^3.3.0",
"tslint": "^5.6.0",
"typescript": "^2.4.2",
"zone.js": "^0.8.16"
...

[shahraship]

+1

[lazarljubenovic]

@shahraship Please use the GitHub's reaction functionality to "vote" on issues instead of writing the "+1" responses.

[wKoza]

Hi @mspl13, Take a look at the existing issues. For example #285 .

[mspl13]

@wKoza Thanks for the quick response and sorry for the duplicate. Just to be clear: the fix for the issue is that the rule will be removed because the functionality is out of scope for this tool?
If so, we should report back to the angular-cli team, which seems to include this rule by default (see for example angular/angular-cli#7587).

[wKoza]

Yes, That's it ! I think it's an a mistake on our part.

@mgechev , you had create this PR but We would also have to modify this file .

I went to open a new PR on devkit repo
Thanks