Issue 1:
I'm submitting a ... (check one with "x")

[X] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

Current behavior

I upgraded my project from SystemJs to webpack (angular-cli). I realized that input and output decorators defined in a base class of a component are not recognized as valid properties. Sample code:

`@Component({

selector: 'foo',

template: '...'

})

export class FooComponent extends FooBase {

}

export class FooBase {

@input() protected testInput: any;

}`

In my html I wanted to use this component normally set testInput variable. With SystemJs there was no problem with this structure. Since I use core-js I get the following error:

Unhandled Promise rejection: Template parse errors:

Can't bind to 'testInput' since it isn't a known property of 'foo'.

Expected behavior

All input and output decorators defined in base classes should be recognized as valid properties of the component.

Reproduction of the problem

I started to debug this problem and I found that the root couse of the problem is the getPrototypeOf() function in the es7 shim of core-js.

This function is much more simplier than it was in System-Js:

getPrototypeOf() in core-js:

module.exports = Object.getPrototypeOf || function(O){
O = toObject(O);
if(has(O, IE_PROTO))return O[IE_PROTO];
if(typeof O.constructor == 'function' && O instanceof O.constructor){
return O.constructor.prototype;
} return O instanceof Object ? ObjectProto : null;
};

getPrototypeOf() in SystemJs:

function GetPrototypeOf(O: any): Object {
let proto = Object.getPrototypeOf(O);
if (typeof O !== "function" || O === functionPrototype) {
return proto;
}
if (proto !== functionPrototype) {
return proto;
}

let prototype = O.prototype;
let prototypeProto = Object.getPrototypeOf(prototype);
if (prototypeProto == null || prototypeProto === Object.prototype) {
return proto;
}

let constructor = prototypeProto.constructor;
if (typeof constructor !== "function") {
return proto;
}

if (constructor === O) {
return proto;
}

return constructor;
}

The first function returns an anonymus function when it reaches the parent of the component since it is using Object.getPrototypeOf() the second returns with the correct parent function. I know that it is not connected direcly to Angular but I'am not an expert of these shims and I cannot decide which is better and why. So that I didn't want to submit a ticket to core-js for the first time.

Since Angular also switched to core-js it can be problematic in the future. What is the proposal for this? Is it a core-js bug?

PS.: If someone would face with the same problem, my workaround was to remove all decorators from the base class and specify them explicitly in the @component attribute.

What is the motivation / use case for changing the behavior?

Described above.

Please tell us about your environment:

Windows 7, IntelliJ, npm, angular-cli

Angular version: 2.0.0-rc.X

Angular 2.0.0 final

Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

all

Language: [all | TypeScript X.X | ES6/7 | ES5]

Typescript 2.2

Node (for AoT issues): node --version = v6.5.0

Issue 2:
In Ionic we use a lot of attributes. For example, say we have an attribute called primary that we only want added if the platform is Android. Doing something like this on an element:

<div [attr.primary]="isAndroid"></div>

Would be added as primary="true" for Android and primary="false" for iOS. We want it to not add primary at all if iOS, and add just primary if Android.

cc @IgorMinar @adamdbradley