diff --git a/modules/upgrade/src/upgrade_module.ts b/modules/upgrade/src/upgrade_module.ts
index af3f5067d6..0e2e17ffd4 100644
--- a/modules/upgrade/src/upgrade_module.ts
+++ b/modules/upgrade/src/upgrade_module.ts
@@ -154,10 +154,12 @@ function ng1ComponentDirective(selector: string, type: Type, idPrefix: string):
link: (scope: angular.IScope, element: angular.IAugmentedJQuery, attrs: angular.IAttributes,
parentInjector: any, transclude: angular.ITranscludeFunction): void => {
var id = element[0].id = idPrefix + (idCount++);
- var childInjector = parentInjector.resolveAndCreateChild([bind(NG1_SCOPE).toValue(scope)]);
+ var componentScope = scope.$new();
+ componentScope.$watch(() => changeDetector.detectChanges());
+ var childInjector =
+ parentInjector.resolveAndCreateChild([bind(NG1_SCOPE).toValue(componentScope)]);
var hostViewRef = viewManager.createRootHostView(protoView, '#' + id, childInjector);
var changeDetector: ChangeDetectorRef = hostViewRef.changeDetectorRef;
- scope.$watch(() => changeDetector.detectChanges());
element.bind('$remove', () => viewManager.destroyRootHostView(hostViewRef));
}
};
diff --git a/modules/upgrade/test/integration_spec.ts b/modules/upgrade/test/integration_spec.ts
index f30c0ad7d1..e2e221d2b0 100644
--- a/modules/upgrade/test/integration_spec.ts
+++ b/modules/upgrade/test/integration_spec.ts
@@ -54,6 +54,43 @@ export function main() {
async.done();
});
}));
+
+ describe('scope/component change-detection', () => {
+ it('should interleve scope and component expressions', inject([AsyncTestCompleter], (async) {
+ var log = [];
+ var l = function(value) {
+ log.push(value);
+ return value + ';';
+ };
+ var upgrMod: UpgradeModule = createUpgradeModule();
+
+ upgrMod.ng1Module.directive('ng1a', () => { return {template: "{{ l('ng1a') }}"}; });
+ upgrMod.ng1Module.directive('ng1b', () => { return {template: "{{ l('ng1b') }}"}; });
+ upgrMod.ng1Module.run(($rootScope) => {
+ $rootScope.l = l;
+ $rootScope.reset = () => log.length = 0;
+ });
+
+ upgrMod.importNg2Component(
+ Component({selector: 'ng2'})
+ .View({
+ template: `{{l('2A')}}