{"action":"created","issue":{"url":"https://api.github.com/repos/angular/angular/issues/602","labels_url":"https://api.github.com/repos/angular/angular/issues/602/labels{/name}","comments_url":"https://api.github.com/repos/angular/angular/issues/602/comments","events_url":"https://api.github.com/repos/angular/angular/issues/602/events","html_url":"https://github.com/angular/angular/issues/602","id":57262969,"number":602,"title":"Passing through static attributes for (some) components","user":{"login":"jelbourn","id":838736,"avatar_url":"https://avatars.githubusercontent.com/u/838736?v=3","gravatar_id":"","url":"https://api.github.com/users/jelbourn","html_url":"https://github.com/jelbourn","followers_url":"https://api.github.com/users/jelbourn/followers","following_url":"https://api.github.com/users/jelbourn/following{/other_user}","gists_url":"https://api.github.com/users/jelbourn/gists{/gist_id}","starred_url":"https://api.github.com/users/jelbourn/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/jelbourn/subscriptions","organizations_url":"https://api.github.com/users/jelbourn/orgs","repos_url":"https://api.github.com/users/jelbourn/repos","events_url":"https://api.github.com/users/jelbourn/events{/privacy}","received_events_url":"https://api.github.com/users/jelbourn/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":1,"created_at":"2015-02-11T01:03:38Z","updated_at":"2015-02-11T07:11:15Z","closed_at":null,"body":"When designing components that wrap native components, there are a lot of attributes that the end-developer would want to apply to the underlying native element. For example, take [`<button>`](http://www.w3.org/TR/2011/WD-html5-20110405/the-button-element.html#the-button-element). It's common to wrap `<button>` in a component in order to manipulate its appearance or add animation, while still using a native button underneath. When doing this, all of the HTML spec attributes, such as `form`, `formAction`, `formMethod`, etc, should still work as expected.\r\n\r\nIt would be super fantastic for component authors to have some easy way to pass/copy through this type of attribute without having to manually creating a binding for each one. Some types of elements can have quite a few of these attributes (`<button>` has 11). Most of the time, attributes like this are completely static, and thus using data binding for them feels like overkill. \r\n\r\nElement types where I think this would apply are `<button>`, `<input>`, `<textarea>`, `<video>`, and `<audio>`. These are all things that someone could conceivably want to wrap in a custom component that passes through the static attributes.\r\n\r\nThere could be more use-cases I'm not considering, but since the set of elements seems limited, this could be something that's scoped specifically to these elements. For example, something like:\r\n```\r\n@Component({\r\n  attributeCopyBehavior: 'button'\r\n})\r\n```"},"comment":{"url":"https://api.github.com/repos/angular/angular/issues/comments/73841578","html_url":"https://github.com/angular/angular/issues/602#issuecomment-73841578","issue_url":"https://api.github.com/repos/angular/angular/issues/602","id":73841578,"user":{"login":"gdi2290","id":1016365,"avatar_url":"https://avatars.githubusercontent.com/u/1016365?v=3","gravatar_id":"","url":"https://api.github.com/users/gdi2290","html_url":"https://github.com/gdi2290","followers_url":"https://api.github.com/users/gdi2290/followers","following_url":"https://api.github.com/users/gdi2290/following{/other_user}","gists_url":"https://api.github.com/users/gdi2290/gists{/gist_id}","starred_url":"https://api.github.com/users/gdi2290/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/gdi2290/subscriptions","organizations_url":"https://api.github.com/users/gdi2290/orgs","repos_url":"https://api.github.com/users/gdi2290/repos","events_url":"https://api.github.com/users/gdi2290/events{/privacy}","received_events_url":"https://api.github.com/users/gdi2290/received_events","type":"User","site_admin":false},"created_at":"2015-02-11T07:11:15Z","updated_at":"2015-02-11T07:11:15Z","body":"I think you're looking for is as simple as extending with the native component `HTMLButtonElement`. With that said I think Angular2 should create a facade for each native component to extend from\r\n\r\n```html\r\n<form (submit)=\"swag()\">\r\n  <awesome-submit-button>Submit</awesome-submit-button>\r\n</form>\r\n<script type=\"text/atscript\">\r\n@Component({\r\n  selector: 'awesome-submit-button',\r\n  template: {\r\n    inline: `\r\n      <button>\r\n        <content></content>\r\n      </button>\r\n   `\r\n  }\r\n})\r\nclass AwesomeSubmitButton extends HTMLButtonElement {\r\n\r\n}\r\n</script>\r\n```"}}