2017-05-04 8 views
0

私はAngularJS 1.6を使用していて、コンポーネント(clock)を持つページ(panel)のコンテナを持っています。角度1.6のコンテナの内側に角2のアプリケーションを作成する

AngularJS 1.6コンテナにAngular 2.0アプリを埋め込むことはできますか?

これはngUpgradeのシナリオですか?この統合を示すためにTypeScriptを学ばなくてもいいです。

Controller.js

'use strict'; 
var app = angular.module('app', []); 

app.directive('clock', function() { 
    return { 
    restrict: 'E', 
    scope: { 
     timezone: '@' 
    }, 
    template: '<div>12:00 {{timezone}}</div>' 
    }; 
}); 

app.directive('panel', function() { 
    return { 
    restrict: 'E', 
    transclude: true, 
    scope: { 
     title: '@' 
    }, 
    template: '<div style="border: 3px solid #000000">' + 
     '<div class="alert-box">{{title}}</div>' + 
     '</div>' 
    }; 
}); 

index.htmlを

<html> 
<head> 
    <meta charset="utf-8"> 

    <script src="/bower_components/angular/angular.js"></script> 
    <script src="js/controller.js"></script> 
</head> 

<body> 

    <div ng-app="app"> 
    <panel title="Title for container"> 
     <clock timezone="PST"></clock> 
    </panel> 
    </div> 

</body> 
</html> 

答えて

0

がngUpgradeに転がりますか!その後、徐々に導入することができます。それはあなたが同じ「アプリ」内にそれらを必要とする場合です - iframeは角度アプリを埋め込むでしょうが、生産目的のために何かとしてそれをアドバイスしません。

0

あなたは2つのアプリケーション間でデータにアクセスするためにアンギュラ1つのテンプレート内のローカルストレージをインラインフレームを使用することができますか?

アンギュラ1つのテンプレート:あなたはこの:)を行う必要があるはずです <iframe src="URLToAngular2App"></iframe>

+0

代わりに 'UpgradeAdapter'を使用していますか? 'iframe'と' localStorage'を使用すると面倒なようです – bobbyrne01

+0

2角形アプリケーションをどのように絡み合わせているのでしょうか?私は個人的にUpgradeAdapterの経験はありませんでしたが、おそらくhttp://blog.rangle.io/upgrade-your-application-to-angular-2-with-ng-upgradeのような記事を見ています。 / – JonRowley

関連する問題