fix(compiler): changed the compiler to set up event listeners and host properties on host view elements

Closes #1584

modules/angular2/test/core/compiler/dynamic_component_loader_spec.js

@@ -22,6 +22,8 @@ import {DynamicComponentLoader} from 'angular2/src/core/compiler/dynamic_compone
 import {ElementRef} from 'angular2/src/core/compiler/element_injector';
 import {If} from 'angular2/src/directives/if';
 import {DirectDomRenderer} from 'angular2/src/render/dom/direct_dom_renderer';
+import {DOM} from 'angular2/src/dom/dom_adapter';
+
 
 export function main() {
   describe('DynamicComponentLoader', function () {
@@ -134,6 +136,29 @@ export function main() {
             });
           });
         }));
+
+      it('should update host properties', inject([DynamicComponentLoader, TestBed, AsyncTestCompleter],
+        (loader, tb, async) => {
+          tb.overrideView(MyComp, new View({
+            template: '<div><location #loc></location></div>',
+            directives: [Location]
+          }));
+
+          tb.createView(MyComp).then((view) => {
+            var location = view.rawView.locals.get("loc");
+
+            loader.loadNextToExistingLocation(DynamicallyLoadedWithHostProps, location.elementRef).then(ref => {
+              ref.instance.id = "new value";
+
+              view.detectChanges();
+
+              var newlyInsertedElement = DOM.childNodesAsList(view.rootNodes[0])[1];
+              expect(newlyInsertedElement.id).toEqual("new value")
+
+              async.done();
+            });
+          });
+        }));
     });
 
     describe('loading into a new location', () => {
@@ -242,6 +267,19 @@ class DynamicallyLoaded {
 class DynamicallyLoaded2 {
 }
 
+@Component({
+  selector: 'dummy',
+  hostProperties: {'id' : 'id'}
+})
+@View({template: "DynamicallyLoadedWithHostProps;"})
+class DynamicallyLoadedWithHostProps {
+  id:string;
+
+  constructor() {
+    this.id = "default";
+  }
+}
+
 @Component({
   selector: 'location'
 })
@@ -254,7 +292,9 @@ class Location {
   }
 }
 
-@Component()
+@Component({
+  selector: 'my-comp'
+})
 @View({
   directives: []
 })

modules/angular2/test/core/compiler/integration_spec.js

@@ -255,20 +255,19 @@ export function main() {
         tb.overrideView(MyComp,
           new View({
             template: '<p [id]="ctxProp"></p>',
-            directives: [IdComponent]
+            directives: [IdDir]
           }));
 
         tb.createView(MyComp, {context: ctx}).then((view) => {
+          var idDir = view.rawView.elementInjectors[0].get(IdDir);
 
           ctx.ctxProp = 'some_id';
           view.detectChanges();
-          expect(view.rootNodes[0].id).toEqual('some_id');
-          expect(view.rootNodes).toHaveText('Matched on id with some_id');
+          expect(idDir.id).toEqual('some_id');
 
           ctx.ctxProp = 'other_id';
           view.detectChanges();
-          expect(view.rootNodes[0].id).toEqual('other_id');
-          expect(view.rootNodes).toHaveText('Matched on id with other_id');
+          expect(idDir.id).toEqual('other_id');
 
           async.done();
         });
@@ -932,7 +931,9 @@ class PushCmpWithRef {
   }
 }
 
-@Component()
+@Component({
+  selector: 'my-comp'
+})
 @View({directives: [
 ]})
 class MyComp {
@@ -1192,14 +1193,11 @@ class DecoratorListeningDomEventNoPrevent {
   }
 }
 
-@Component({
+@Decorator({
   selector: '[id]',
   properties: {'id': 'id'}
 })
-@View({
-  template: '<div>Matched on id with {{id}}</div>'
-})
-class IdComponent {
+class IdDir {
   id: string;
 }