Angular6中開啟新的視窗

2022-06-03 12:12:07 字數 1059 閱讀 2356

需求:

angular6的環境下,在乙個頁面中有乙個標籤,點選鏈結後,需要跳轉到新的頁面(注意新的頁面是在瀏覽器的新視窗中開啟)。

方案:使用angular 的路由功能,使用 routerlink 屬性處理。

具體過程:

1、新建乙個元件,作為跳轉介面的內容:

ng g c childpage
2、在新的childpage.component.html 模板檔案中寫自己需要展現的內容。

import from '@angular/core';

import from '@angular/common';

import from '@angular/router';

import from '../manager/demo/childpage.component';

const routes: routes = [,];

@ngmodule()

constructor(public router: router)

}4、然後在當前的介面(即跳轉前的介面)中設定標籤

跳轉到新頁面a>

1.使用html:target="_blank",在新的頁面中開啟鏈結,形成父子介面的關係。

_blank -- 在新視窗中開啟鏈結 

_parent -- 在父窗體中開啟鏈結 

_self -- 在當前窗體開啟鏈結,此為預設值 

_top -- 在當前窗體開啟鏈結,並替換當前的整個窗體(框架頁)

2.window.opener 的用法 

window.opener 返回的是建立當前視窗的那個視窗的引用,比如點選了a.htm上的乙個鏈結而開啟了b.htm,

然後我們打算在b.htm上輸入乙個值然後賦予a.htm上的乙個id為「name」的textbox中,就可以寫為: 

window.opener.document.getelementbyid("name").value = "輸入的資料"; 

Angular6 中環境配置

在專案公升級到angular6之後環境配置有了一些變化。檔名的變化 之前 angular cli.json 現在 angular.json。內容的變化 之前 現在 現在的格式多了乙個configurations,其中使用了replace的替換方式,將 replace 的value值替換成 with ...

Angular6中使用primeNG UI框架

第一步 使用ng new project ng new primengproject 1第二步 可以執行一下是否成功 ng s 1第三步 安裝primeng npm install primeng 1第四步 安裝font awesome 乙個圖示字型庫和css框架 npm install font ...

Angular 6 滾動列表元件的封裝

如果資料量比較小的話,我們完全可以將資料一次性全部拿出來,放到dom中進行迴圈滾動。實際就是類似輪播圖的效果。但若有很多資料的話,這樣做很可能造成記憶體洩露。自然,我們可以想到將列表資料分頁。我最初的想法是,在table的外層放乙個div作為容器,然後table定時向上增加top值,等table跑了...