{"action":"created","issue":{"url":"https://api.github.com/repos/angular/angular/issues/12911","repository_url":"https://api.github.com/repos/angular/angular","labels_url":"https://api.github.com/repos/angular/angular/issues/12911/labels{/name}","comments_url":"https://api.github.com/repos/angular/angular/issues/12911/comments","events_url":"https://api.github.com/repos/angular/angular/issues/12911/events","html_url":"https://github.com/angular/angular/issues/12911","id":189631168,"number":12911,"title":"Using structural directive with ngFor, ngTemplateOutlet causes runtime error in production mode","user":{"login":"log2-hwan","id":927921,"avatar_url":"https://avatars.githubusercontent.com/u/927921?v=3","gravatar_id":"","url":"https://api.github.com/users/log2-hwan","html_url":"https://github.com/log2-hwan","followers_url":"https://api.github.com/users/log2-hwan/followers","following_url":"https://api.github.com/users/log2-hwan/following{/other_user}","gists_url":"https://api.github.com/users/log2-hwan/gists{/gist_id}","starred_url":"https://api.github.com/users/log2-hwan/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/log2-hwan/subscriptions","organizations_url":"https://api.github.com/users/log2-hwan/orgs","repos_url":"https://api.github.com/users/log2-hwan/repos","events_url":"https://api.github.com/users/log2-hwan/events{/privacy}","received_events_url":"https://api.github.com/users/log2-hwan/received_events","type":"User","site_admin":false},"labels":[{"id":375501288,"url":"https://api.github.com/repos/angular/angular/labels/comp:%20core%20&%20compiler","name":"comp: core & compiler","color":"c7def8","default":false},{"id":375498262,"url":"https://api.github.com/repos/angular/angular/labels/severity5:%20regression","name":"severity5: regression","color":"0052cc","default":false}],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":6,"created_at":"2016-11-16T08:40:52Z","updated_at":"2016-11-16T16:45:03Z","closed_at":null,"body":"**I'm submitting a ...**  (check one with \"x\")\r\n```\r\n[x] bug report => search github for a similar issue or PR before submitting\r\n[ ] feature request\r\n[ ] support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question\r\n```\r\n\r\n**Current behavior**\r\n```\r\n@Directive({\r\n\tselector: 'template[carouselItem]'\r\n})\r\nexport class CarouselItem {\r\n\tid: string;\r\n\r\n\tconstructor(public templateRef: TemplateRef<any>) {}\r\n}\r\n\r\n@Component({\r\n\tselector: 'carousel',\r\n\ttemplate: `\r\n\t<div class=\"banner-group\">\r\n\t\t<div class=\"banner\" *ngFor=\"let item of item_list\">\r\n\t\t\t<template [ngTemplateOutlet]=\"item.templateRef\"></template>\r\n\t\t</div>\r\n\t</div>\r\n\t`\r\n})\r\nexport class Carousel {\r\n}\r\n\r\n@Component({\r\n  selector: 'my-app',\r\n  template: `\r\n    <carousel>\r\n      <template ngFor let-t [ngForOf]=\"[0, 1]\">\r\n        <div *carouselItem>Test!</div>\r\n      </template>\r\n    </carousel>\r\n  `\r\n})\r\nexport class App {\r\n}\r\n```\r\n\r\nThis code worked fine until version 2.1.2.\r\nBut after upgrading to 2.2.0 it is broken and showing this error.\r\n\r\n```\r\ncore.umd.js:2840 TypeError: Cannot read property 'appendChild' of null\r\n    at appendChild (platform-browser.umd.js:1200)\r\n    at View_App1.visitRootNodesInternal (VM2335 component.ngfactory.js:123)\r\n    at View_App1.AppView._renderAttach (core.umd.js:9256)\r\n    at View_App1.AppView.attachAfter (core.umd.js:9234)\r\n    at ViewContainer.attachView (core.umd.js:9561)\r\n    at ViewContainerRef_.insert (core.umd.js:7137)\r\n    at ViewContainerRef_.createEmbeddedView (core.umd.js:7117)\r\n    at eval (common.umd.js:1338)\r\n    at DefaultIterableDiffer.forEachOperation (core.umd.js:3343)\r\n    at NgFor._applyChanges (common.umd.js:1336)\r\n```\r\n\r\nI don't know much about Angular2's internal code, but seems this error is caused by Direct renderer which is newly introduced by 2.2.0.\r\n\r\n**Minimal reproduction of the problem with instructions**\r\nWorking version (angular 2.1.2): http://plnkr.co/edit/qeIrSjXXCYJPKTwLxiIV\r\nBroken version (angular 2.2.0): http://plnkr.co/edit/wEhMdzVmANgB2a1TpOwU\r\n\r\n**Please tell us about your environment:** macOS 10.12.1\r\n\r\n* **Angular version:** 2.2.0\r\n\r\n* **Browser:** all\r\n \r\n* **Language:** TypeScript 2.0.3\r\n"},"comment":{"url":"https://api.github.com/repos/angular/angular/issues/comments/261000311","html_url":"https://github.com/angular/angular/issues/12911#issuecomment-261000311","issue_url":"https://api.github.com/repos/angular/angular/issues/12911","id":261000311,"user":{"login":"tbosch","id":690815,"avatar_url":"https://avatars.githubusercontent.com/u/690815?v=3","gravatar_id":"","url":"https://api.github.com/users/tbosch","html_url":"https://github.com/tbosch","followers_url":"https://api.github.com/users/tbosch/followers","following_url":"https://api.github.com/users/tbosch/following{/other_user}","gists_url":"https://api.github.com/users/tbosch/gists{/gist_id}","starred_url":"https://api.github.com/users/tbosch/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/tbosch/subscriptions","organizations_url":"https://api.github.com/users/tbosch/orgs","repos_url":"https://api.github.com/users/tbosch/repos","events_url":"https://api.github.com/users/tbosch/events{/privacy}","received_events_url":"https://api.github.com/users/tbosch/received_events","type":"User","site_admin":false},"created_at":"2016-11-16T16:45:03Z","updated_at":"2016-11-16T16:45:03Z","body":"The root cause is using a template directive (like `ngIf` / `ngFor`) as content children of a component element."}}
{"actor":{"display_login":"tbosch"}}