修改

Question

问题与此one的问题相同，但反之亦然。

我想在Angular 2应用程序中嵌入一个Angular 1.x应用程序。更具体地说，this app。我知道有一些方法可以单独升级元素，但这是一个大型项目，我只是想将它嵌入Angular 2应用程序的一个标签中。

我尝试了一种非常天真的方法，我将dist文件夹复制到我的某个组件中，并尝试将index.html用于<div ng-app="app"> <div ng-view=""> </div></div>

现在我正在尝试将所有minifed javascript（包括angular 1.x库以及一些应用程序特定的javascript文件和css）加载到我自己的{angle index.html主角2应用程序中。然后我通过我的组件从dist目录加载index.html。问题似乎是Angular 1库似乎无法加载。

我有几个问题;

如果库（js）文件作为ts加载会有帮助吗？我假设可以同时加载Angular 1和2库。
如果可以，有一种简单的方法可以将js文件转换为.ts个文件。

修改

我使用angular.boostrap调用使其工作，如下所示。以下是我的组件的代码片段

import {Component, AfterViewInit, OnInit} from 'angular2/core';

    declare var angular:any;
    @Component({
        selector: 'server-monitor',
        templateUrl: 'app/components/server-monitor/dist/index.html',
        styleUrls: ['app/components/server-monitor/dist/styles/vendor-c0a35f80.css',
            'app/components/server-monitor/dist/styles/main-0c4cc0e5.css',
            ],
    })
    export class ServerMonitorComponent  implements AfterViewInit, OnInit{

ngOnInit(){
        angular.bootstrap(document, ['app']);
    }
}

然而，现在我遇到了另一个问题。原始project非常频繁地进行大量的http调用（默认为2秒），以获取有关系统的实时统计信息。

当我将此嵌入到我的应用程序中时，我可以看到调用已经完成，但我的页面保持刷新并且不会在图表上显示任何内容。我理解我必须修改http调用的内容，但不确定在哪里。

Answer 1

除了上面的编辑，我修改了原始应用中的$routeProvider，它似乎工作得很好

将Angular 1.x应用程序嵌入角度2.0应用程序中

修改

1 个答案: