想实现的效果: 点击连接,新建一个多标签页面,在这个多标签页面里面展示路由对应的页面(类似easyui的多标签)
问题: 我看网上的教程都是, 点击一个链接,会覆盖上一个链接的页面。我的内容区域 永远只有一个页面,是不是单页面应用无法实现我想要的效果
ringa_lee2017-05-15 17:10:03
この質問を3回繰り返し読みましたが、質問者が表現したいことがaタグのtarget属性によって得られる効果なのかわかりません。 。 。
https://developer.mozilla.org...
target
この属性は、リンクされたリソースを表示する場所を指定します。 HTML4 では、これはボックスの名前またはキーワードです。 HTML5 では、これは閲覧コンテキスト (タブ、ウィンドウ、iframe など) の名前またはキーワードです。次のキーワードには特別な意味があります:
_self: 現在のページがロードされます。つまり、同じ HTML 4 フレーム (または HTML5 閲覧コンテキスト) に対する現在の応答です。属性が指定されていない場合、この値はデフォルトです。
_blank: 新しいウィンドウ、つまり新しい名前のない HTML4 ウィンドウまたは HTML5 ブラウザー コンテキストを開きます
_parent: 現在のフレームの HTML4 親フレーム、または現在の HTML5 ブラウジングの親ブラウジング コンテキストに応答を読み込みますコンテクスト 。親フレームまたは参照コンテキストがない場合、このオプションは _self と同じように動作します。
_top: IHTML4: 応答を完全な元のウィンドウにロードし、他のすべてのフレームをキャンセルします。 HTML5 の場合: 応答をトップレベルのブラウジング コンテキスト (つまり、現在のブラウジング コンテキストの祖先であり、親を持たないブラウジング コンテキスト) に読み込みます。親フレームまたは参照コンテキストがない場合、このオプションは _self と同じように動作します。
この属性は、href 属性が存在する場合にのみ使用できます。
ringa_lee2017-05-15 17:10:03
この種の単一ページは実装が簡単です:
Angular2
の場合: Angular2
:
写一个Service
用来存储Tab(如果刷新后Tab还有的话,最好用localStorage
)。
在原始的IFrame
位置,放置路由<outlet></outlet>
,Angular2
用来替换为路由输出的。
上面的Tab就是一个简单数组,对应Tab标题和路由。点击后跳转到指定路由,就会根据路由配置,自动替换<outlet></outlet>
Service
を作成します (更新後にタブがまだある場合は、localStorage
を使用するのが最善です)。
元の IFrame
の位置にルート <outlet></outlet>
を配置し、Angular2
を使用してルート出力を置き換えます。 。
<outlet></outlet>
の内容がルート構成に応じて自動的に置き換えられます。 🎜しかし、問題があります。これは直接置き換えるので、ページのステータスを保存するのが最善です。そうしないと、初期化されたインターフェイスに戻ります。 🎜🎜 🎜これは単なる単純な解決策であり、各タブを個別に分離することをお勧めします。 🎜