IONIC2如何重新加载页面
IONIC2是一个基于Angular框架的混合移动应用开发框架。它允许开发者使用HTML、CSS和JavaScript构建跨平台的移动应用程序。
在IONIC2中，重新加载页面可以通过以下几种方式实现：
- 使用Ionic提供的NavController导航控制器：
- 首先，在需要重新加载的页面中导入NavController。
- 然后，在需要重新加载的方法中调用
this.navCtrl.setRoot(PageName)，将要重新加载的页面名称作为参数传递给setRoot方法。
- 使用Angular的Router模块：
- 首先，在需要重新加载的页面中导入Router。
- 然后，在需要重新加载的方法中调用
this.router.navigateByUrl('/page-name', { skipLocationChange: true }).then(() => { this.router.navigate(['/page-name']); });，将要重新加载的页面路径作为参数传递给navigateByUrl方法。
- 使用Ionic提供的Events事件：
- 首先，在需要重新加载的页面中导入Events。
- 然后，在需要重新加载的方法中调用
this.events.publish('page:reload');，发布一个名为'page:reload'的事件。 - 最后，在需要重新加载的页面的构造函数中订阅该事件，并在回调函数中执行重新加载的逻辑。
以上是IONIC2中重新加载页面的几种常用方法。根据具体需求和场景，选择合适的方法即可。
腾讯云相关产品和产品介绍链接地址：
- 腾讯云移动应用开发平台：https://cloud.tencent.com/product/madp
- 腾讯云云服务器（CVM）：https://cloud.tencent.com/product/cvm
- 腾讯云云数据库MySQL版：https://cloud.tencent.com/product/cdb_mysql
- 腾讯云云原生容器服务：https://cloud.tencent.com/product/tke
- 腾讯云人工智能平台：https://cloud.tencent.com/product/ai
- 腾讯云物联网平台：https://cloud.tencent.com/product/iotexplorer
- 腾讯云对象存储（COS）：https://cloud.tencent.com/product/cos
- 腾讯云区块链服务：https://cloud.tencent.com/product/baas
- 腾讯云游戏多媒体引擎：https://cloud.tencent.com/product/gme
- 腾讯云音视频处理服务：https://cloud.tencent.com/product/vod
相关·内容
在Ionic2中使用Angular2
利用userService登录并从服务器拉出用户，但是在nav更改(或单击nav中的现有页面)时，它会进行重新加载，这会导致服务重新初始化(我认为)并清空服务中的用户。
当我在整个应用程序中导航时，如何在服务中保留user / user$变量？
浏览 17提问于2018-02-01得票数 0
我正在使用 Ionic2创建一个应用程序，其要求是--当第一次加载该应用程序时将显示一个登录页面，并且在登录时将启用一个侧菜单页面。
初学者项目显示，侧菜单作为应用程序的根，在任何其他页面打开之前先加载，然后加载其他相关页面。
我如何构建一个应用程序，先加载登录页面，然后将侧菜单设置为主导航，而从不显示登录屏幕？？
我用离子1做了这件事，但无法用ionic2弄清楚。
请帮帮忙。
浏览 16提问于2016-05-20得票数 4
回答已采纳
2回答
我们需要ionic2中的需求之一的指导。我们希望创建一个ionic2应用程序，它可以在移动( iOS和Android作为混合应用程序)以及桌面和移动浏览器上运行。
正如ionic2教程中提到的，我们已经创建了一个示例应用程序。在构建了这个应用程序之后，我们发现：
这个应用程序需要时间来加载第一个页面，因为一个应用程序被捆绑在一个大小约为2.8MB的.js文件(app.bundle.js)中(因为Webpack的功能)。
缩小后，它会减少到大约。1.2 MB。
现在，这只是一个示例应用程序，默认菜单选项来自github。
我们关心的是在添加了项目代码之后，它的大小肯定会增加，因此
浏览 0提问于2016-03-02得票数 1
在Ionic2和Angular2上，如何在登录页面上禁用sidemenu。这是app.html页面的html代码，它在每个页面上加载侧边菜单
<ion-toolbar>
<ion-title>Pages</ion-title>
</ion-toolbar>
<ion-content>
<ion-list>
<button menuClose ion-item *ngFor="#p of pages" (click)="openPage(p)">
浏览 2提问于2016-05-05得票数 0
0回答
我在Ionic2应用中使用Firebase3。要求加载大约2000个对象的数据，每次页面切换(使用导航)时都需要加载数据。但是每次加载数据看起来都不太好。
那么，有没有像联系人列表这样的一次获取数据的解决方案呢？
则加载的数据将从本地显示。
谢谢!
浏览 0提问于2017-01-01得票数 2
我已经为安卓手机创建了一个Ionic2应用程序。为了实现多种功能，我使用了各种插件来服务于我的请求。我的应用程序(生产版本)需要13-15秒的初始加载时间。对于有插件的Ionic2应用程序来说，这个加载时间是自然的吗？
浏览 1提问于2017-02-17得票数 3
回答已采纳
3回答
我想在div中显示一个背景图像/加载微调器，它将加载其中的图像，图像将在完全加载后显示，执行以下操作：
<div style="background-image:url('imageThatWillAppearBeforeLoad')"></div>
如何使用Angular2/Ionic2实现相同的功能？
浏览 1提问于2016-07-23得票数 7
回答已采纳
我目前正在做一个Ionic2项目。在一个页面(例如PageB)上，我显示了一个Loader (在ionViewWillEnter()事件中)，直到Ajax请求成功，然后调用loader.dismiss()。它工作得很完美。在ajax请求之后，用户单击要转到下一页的内容(例如: PageC)。但是当用户从PageC返回到PageB时，加载器再次可见。
我想知道是否有任何函数，以便在PageB加载时，我可以知道页面是否从PageC转换而来(来自历史)，并防止加载程序加载。
PageB的简单代码是
ionViewWillEnter()() {
this.presentLoad
浏览 1提问于2016-12-26得票数 0
回答已采纳
我试图使用Ionic2为长期服务进度报告显示加载动画：
this.loading = this.loadingCtrl.create({
content: 'Please wait...',
spinner: 'ripple' // <<------ Is that correct?
});
this.loading.present();
结果是一个没有任何旋转器的文本框。
这是09/22/2016 Ionic2使用最新的测试版(11)，我实际上找不到任何像上面这样的例子。这是否是一个未来的功能记录，但尚未实现？
我说的是Ionic
浏览 8提问于2016-09-22得票数 1
如何检查ionic2页面是否处于活动状态？
例如，如果页面处于活动状态，我想隐藏一个按钮：
<button primary [hidden]="isActive('actualPageName')">
Should be hidden
</button>
浏览 6提问于2016-04-19得票数 8
回答已采纳
2回答
我的ionic2应用程序加载主页，并使用自定义DBService开始获取数据，该app使用Cordova SQLite插件，但此时平台还没有准备好，因此sqlitePlugin不可用。
如何在平台就绪(且SQlite数据库打开)之前停止应用程序引导？
我发现了一个基于angular1的应用程序的，它的引导被延迟到'deviceready‘事件被触发。
有人能为基于ionic2的应用程序推荐一个解决方案吗？
浏览 0提问于2016-12-14得票数 2
2回答
实际上，我正在Ionic2中创建一个应用程序，其中我已经将我的根页面设置为loginpage，用户在其中添加他的凭据，并且在成功的情况下，登录将使用setRoot (比如说Page1 )重定向到另一个页面。
问题是，在移动应用程序中按回键时，用户被迫再次登录屏幕，但我希望设置它的会话。
有谁能告诉我这个问题是什么以及我如何克服这个问题。
我在菜单中使用了ionic2作为启动。
浏览 5提问于2016-12-23得票数 0
回答已采纳
2回答
我有一个 ionic2 页面，我想在离子项目中打印HTML：这是ionic2页面：
@Page({
templateUrl: './html-page.html',
})
export class Demo{
htmlString:string = "Hello<br/><br/>Html"
constructor() {
}
}
下面是相应的模板：
<ion-content>
<ion-card>
{{htmlString}}
</ion-
浏览 0提问于2016-03-29得票数 0
回答已采纳
1回答
在ionic2 (v 2.1.7)中关闭一个模态表单之后，如何调用一个方法？以下是我的工作流程
用户加载页面(A页)
然后单击按钮打开模态表单(B页)
添加一些详细信息(这将更新服务)
关闭模态表(B页)
现在，我想向页面A添加一个回调，并从服务中读取新的值
这就是我所做的
#page A
let modal = this.modalCtrl.create(NewListPage);
modal.present();
getValueFromService()
#page B
updateService()
this.viewCtrl.dismiss();
当
浏览 1提问于2016-11-13得票数 1
回答已采纳
8回答
在选项卡页之前，我几乎没有其他常规页面，而"< Back"总是出现在左上角。
当到达我的选项卡页面时，我会丢失标题中的"< Back"。为什么？
如何在Ionic2中使用选项卡时返回后退按钮？
浏览 6提问于2015-12-18得票数 7
我希望将wikitude集成到我现有的ionic2应用程序中。我看到有一个cordova插件用于wikitude集成。但是在wikitude文档中没有ionic2的例子。
在ionic2中是否有任何用于wikitude的样板代码？如何开始与ionic2集成wikitude？
浏览 4提问于2016-12-31得票数 0
回答已采纳
1回答
我用mongoDB做后盾，
当应用程序中的身份验证状态发生变化时，firebase.auth().onAuthStateChanges()方法会监听。那真是太酷了。
但同样的事情没有发生在我的情况下，因为我没有使用类似的支持。
我将在下面分享我的代码，在此之前，我将告诉您如何通过app.component.ts中的构造函数来获取用户。当用户成功地登录到我的应用程序时，我得到的是唯一标记的用户，这是我存储在ionicStorage中的。同时，我在app.component.ts的构造函数中调用了一个服务，以便从本地存储中获取用户。它是工作的，但我的app.component没有触发时，用户注册？
浏览 3提问于2017-05-27得票数 1
回答已采纳
1回答
IONIC2缓存管理
、、、
我已经创建了一个使用离子2的应用程序。我的所有页面都需要通过REST API加载，有时在没有更新的情况下在每个选项卡中重新加载是令人恼火的。
现在我想通过在我的应用程序中实现缓存来改善这一点。我希望它像每个http请求将被保存后，第一次与当前的时间戳和2小时后，它将通过REST Api加载的内容。
任何例子都是很好的。我试着使用这个插件，但在安装后出现了一些问题，它显示错误。
我知道使用Sqlite会更好，但我不是很确定，正在寻找专家的建议。
这是我的主页代码：
import { WebService } from '../shared/services/web.service'
浏览 0提问于2017-07-14得票数 0
这就是我想做的。
在Ionic2弹出菜单中放置组单选按钮。
这些选项实际上控制着内容将要加载的JSON文件。
用户选择一个选项，关闭弹出，内容将相应更新在页面中。
我不知道如何将值从Ionic2 Popover传递给它的父组件。如果我正确理解的话，Ionic2的Popover是一个子组件。但是，我不知道如何传递[(ngModel)]值。
我知道这里看起来很乱..。好吧，如果有人能做一个简单的例子，说明如何将值从PopOver传递到页面.
所以..。所有这些都在一个文件中：
import {Component, Injectable, Input, Output, Event
浏览 14提问于2016-07-20得票数 1
回答已采纳
我目前正在开发ionic2应用程序。
在一个离子页面中，我嵌入了一个Iframe
<iframe id="iframeId" #iframe src="./epubpages/s006-Lesson-001.xhtml" width="100%" height="100%" (load)="onLoad()"></iframe>
在页面.ts文件内部
@ViewChild('iframe') iframe:ElementRef;
onLoad() {
console.log
浏览 9提问于2016-08-17得票数 1
2回答
我的Ionic2应用程序中有一个动态选项卡页面，如下所示：
<ion-tabs #myTabs class="tabs-md" type="md" [tabsHighlight]="true" [selectedIndex]="mySelectedIndex">
<ion-tab *ngFor="let tab of tabRoots" [root]="tab.page" [tabTitle]="tab.name" [tabIcon]="tab.icon
浏览 2提问于2017-05-17得票数 0
我正在尝试建立混合移动应用程序。在我的本地android应用程序中，我已经成功地实现了“谷歌地图标记”页面。在此页面中，当用户单击地图上的“标记”时，用户可以选择从标记中“获取方向”。这是我的原生android“地图”页面的截图。
现在，问题是我正在为IONIC-2框架中的混合应用程序构建相同的“地图”页面。我已经成功地在ionic2混合应用程序中实现了标记选项，但是当我点击标记时，我没有得到这个2选项是我的ionic2应用程序。我没有得到任何实现这一点的线索。
当我使用IONIC-2框架点击地图中的标记时，请建议如何获得这两个选项。此屏幕截图来自我的本地android应用程序，我正在尝试在
浏览 0提问于2017-07-19得票数 0
1回答
我是Ionic2的新手，只是个学习者。
我只想在单个页面中设置css文件，而不是全局设置。
我知道如何在全局设置css文件，但不知道如何在本地设置css文件。
当更新文件app/theme/app.core.scss时，就可以了。但它是全球性的。
如何在单个页面上本地设置css？
感谢您的阅读。
浏览 2提问于2016-05-30得票数 0
回答已采纳
您好，我是ionic2新手，我正在尝试将来自的owl carousel 2添加到我的ionic 2应用程序中。我已经将所需的css/js包含到应用程序中，并且加载成功(没有控制台错误)，但旋转木马没有显示，只是一个没有错误的空白页面，什么都没有。我已经在一个普通的html页面上尝试过同样的carousel，它工作得很好。以下是我的代码：
<link rel="stylesheet" href="assets/css/owl.carousel.min.css">
<link rel="stylesheet" href="
浏览 1提问于2017-02-16得票数 0
使用以下命令，我在我的ionic2项目中安装了一个cordova插件：
cordova plugin add cordova-plugin-rfduino
此插件在Ionic Native中不可用。如何在离子页面中使用插件？我能以某种方式导出它吗？
浏览 3提问于2017-03-09得票数 1
回答已采纳
1回答
我是Ionic2的新手，在官方文档中我发现，为了进一步定制Ionic2组件(如按钮、离子输入等)，我需要使用sass变量。但它们是全局变量，因此它们适用于所有元素。有没有办法将这些变量仅应用于相同的页面，或者使用这些sass变量提供的不同样式来定义不同的输入？提前进行Thx检查。
浏览 2提问于2017-02-14得票数 0
我需要禁用ionic2缓存加载。我使用以下命令来运行一个与ionic.config.js不同的app.There文件
ionic serve
浏览 3提问于2018-05-22得票数 0
1回答
页面加载后的离子滚动
、、、
我正在使用Ionic2，当页面加载时，我需要滚动一个列表到一个特定的位置。
我所做的工作如下：
public ionViewDidEnter(): void {
if (this.content) {
this.content.scrollTo(0, this.lastScrollPos, 0);
}
}
问题
这是可行的，但我的问题是，即使滚动时间为0，滚动动画仍然是可见的用户。
问题
是否有一种方式来做滚动，但它不是显而易见的用户？我尝试过在ionViewWillEnter中做滚动，但它没有滚动，因为我认为这还为时过早，列表还不存在。
谢谢
浏览 0提问于2017-05-12得票数 1
我正在使用Ionic2，并且希望在用户事件上显示/隐藏menuToggle。在Ionic1中，是如何完成的。有谁知道如何在Ionic2中做到这一点吗？
谢谢
浏览 4提问于2017-04-01得票数 0
3回答
在呈现“页面”之前获取数据异步
、、、、
在呈现Page之前获得数据异步的正确方法是什么？
据我所知，Angular2建议@CanActivate装饰师。遗憾的是，这并不适用于Ionic2，至少对我和来说都是如此。
显然，Ionic2对@CanActivate装饰师做了些什么，，但是它没有被记录下来，我也搞不清楚它到底做了什么。
尽管如此，指出，无论如何都应该使用Ionics View States作为替代，这是因为采用了仿生学缓存。他的例子如下：
onPageWillEnter() {
return this._service.getComments().then(data => this.comments
浏览 2提问于2016-04-12得票数 16
回答已采纳
2回答
angular2中的全局对象
、、、、
如何在angular2中创建全局对象。我正在使用navParams in ionic2从一个页面到另一个页面逐页收集数据(可能是4-5页)。但是想要将它存储在全局对象中&最后提交它。我尝试过使用全球提供商，但没有得到大部分&也没有得到任何线索。请有任何建议。
浏览 4提问于2017-07-12得票数 0
回答已采纳
我正在使用ionic2和wordpress api，面对这个错误，XMLHttpRequest无法加载。请求的资源上不存在“Access-Control-Allow-Origin”标头。因此不允许访问源'‘。
浏览 0提问于2017-04-12得票数 0
我正在开发一个Ionic2应用程序。我对registerBackButtonAction功能感到困惑。
我已经在一页(比如pageA)上完成了这个工作。它正在如预期的那样运作。
this.platform.registerBackButtonAction(() => {
console.log("back presed");
this.abortDownloadAndExit();
});
现在，我想在其他页面上对registerBackButtonAction执行其他操作(sayPageB)。但是Ionic正在采取pageA的行动
我如何在不同
浏览 6提问于2017-03-27得票数 6
我想为我的Ionic2应用程序订阅Firebase中的某些主题，所以我想知道如何在Ionic2中创建它们。演示的示例代码是great.Thanks would。
浏览 0提问于2016-10-26得票数 2
我正在使用最新版本的Ionic2 (2.0.0 final！)，我面临的问题是我的图像在应用程序中的位置。
我的图像位置是：
src\资产\img\
在我的html页面中，我使用的img标记如下：
<img src="img/do.png"/>
当我运行离子服务时，图像被加载得很好。
但是，当我运行“离子运行android”时，图像没有被加载，我得到的是错误：
未能加载资源: net::ERR_FILE_NOT_FOUND
file:///android_asset/www/img/do.png
浏览 2提问于2017-02-23得票数 1
回答已采纳
我正在尝试将推送通知添加到我的Ionic2应用程序。我在跟踪。在按照ionic2推送文档页面中的建议执行ionic io init之前，我的应用程序工作正常。现在每次执行ionic serve时，我都会收到这个错误
bundle failed: 'CloudModule' is not exported by node_modules/@ionic/cloud-angular/dist/es5/index.js
(imported by src/app/app.module.ts). For help fixing this error see htt
浏览 2提问于2016-10-21得票数 1
1回答
我想用ionic2 + angular2实现搜索功能。在以前的版本中，我使用了，但是在较新的版本中，这是行不通的。
它是如何与angular2 + ionic2工作的？
浏览 1提问于2016-08-01得票数 0
回答已采纳
3回答
当我在angular 2(ionic 2)应用程序中加载主页时，我想要调用服务/函数。如何做到这一点？
在加载应用程序(首页加载)时，我第一次可以将其写入constructor，中，但当用户开始使用该应用程序和push新页面到nav controller和pop中以返回home page，时，constructor将不会再次被调用。
我被困在这里了。
我想知道实现这一功能的最佳方法是什么？
我是angular2和ionic2 framework的新手(也没有angular1和ionic1)，方面的经验，请帮帮我。
非常感谢。
更新
我试过的代码样本，但没有起作用。
import {Page,
浏览 3提问于2016-03-19得票数 7
回答已采纳
2回答
谁能解释如何在ionic2项目中添加pdfjs，这样我们就可以导入和使用it.Thanks了。
我知道如何使用pdfjs，但无法找到在ionic2项目中导入pdfjs的任何方法。
浏览 1提问于2016-08-26得票数 0
回答已采纳
我是Ionic2的新手，我正在尝试根据当前的菜单选择构建动态选项卡。我只是想知道如何使用导航控制器获得当前页面。
...
export class TabsPage {
constructor(navParams: NavParams,navCtrl:NavController) {
//here I want to get current page
}
}
...
从api文档中，我觉得getActiveChildNav()或getActive()会给我当前的页面，但我对ViewController/Nav一无所知。
任何帮助都将不胜感激。提前谢谢。
浏览 8提问于2016-11-22得票数 16
回答已采纳
我必须导入驻留在node_modules中的一些样式表(bootstrap.css从node_modules，等等)。我试过了
在@Page中添加styleUrls，
将样式放在页面组件文件夹中的.scss文件中，
最后，通过创建新的样式标记将样式放入模板文件本身.所有这些都没有运气，即所需的样式没有被应用到带有适当类的标记上。
怎么做？
PN:我在app.core.scs中为我的组件导入了页面scss。无论如何，我认为将bootstrap.min.css放入页面scss并不是一个好方法。
浏览 2提问于2016-03-23得票数 4
回答已采纳
2回答
在Ionic2中，当页面加载时，我使用融合代码加载标记，但它显示了错误：
initializeMap() {
let minZoomLevel = 16;
Geolocation.getCurrentPosition().then((position) => {
this.map = new google.maps.Map(document.getElementById('map_canvas'), {
zoom: minZoomLevel,
center: new google.maps.LatLng(position.coords.latitude, positio
浏览 4提问于2017-02-28得票数 0
回答已采纳
2回答
我正在ionic2中创建一个应用程序。我正面临一个问题，在成功登录的应用程序，如果我刷新页面，它再次迫使我登录屏幕，但它不应该，因为我已经登录。
我在菜单上使用了Ionic 2作为开场白。
我采取了以下步骤：
将根页设置为Loginpage而不是Page1，app.component.ts文件中的默认设置是其中的一个。
rootPage: any = Loginpage;
单击submit重定向到新创建的homepage.ts，如：
this.navCtrl.push(Homepage,{});
在homepage.ts中，我将根页面设置为一个页面中的任意一个，page2设置为：
浏览 2提问于2016-12-14得票数 2
回答已采纳
1回答
如何在ionic2项目中使用framework7？
我在my ionic2项目中安装了framework7：
npm i framework7 --save
我想要做的是从向项目添加typescript定义
但我不确定如何做到这一点。
浏览 2提问于2016-11-13得票数 0
我正在寻找ionic2最佳实践来显示加载、警报和控制台日志。
所以，不要在每一页中重复下面的代码，这样我就可以调用它一次。
例如，显示加载的代码：
showLoading() {
this.loading = this.loadingCtrl.create({
content: ''
});
this.loading.present();
}
创建提供者并显示上次加载是最佳实践吗？或者提供者不支持加载或类似的东西？
谢谢。
浏览 0提问于2018-03-09得票数 1
回答已采纳
嗨，我一直在使用Ionic2 (应用程序A)通过<a href="otherapp://>调用其他Ionic2应用程序(应用程序B)，它有时可以成功调用，但大多数时候它停留在加载页面。
我目前的解决方案是使用App B而不是App A调用App A，然后让app A回调App B，但是有没有更好的方法来解决这个问题
这是卡住时的样子的视频
浏览 0提问于2018-03-20得票数 0
我按照Ionic2文档的指示安装了Google插件：
但是，我得到了以下错误
例外: Uncaught (承诺)：object对象
我是在网络浏览器上运行的，也是在一个本地设备上运行的，并不是所有情况下都能工作。
知道怎么回事吗？
浏览 4提问于2017-01-07得票数 3
1回答
我想为ionic2移动和网络提供不同的CSS。例如:移动应用和web应用的列表宽度和高度不同，移动和web应用的列表字体和对齐方式也不同。请让我知道如何为ionic2移动应用程序实现这一点。
谢谢,
浏览 0提问于2017-09-12得票数 0
我正在做ionic2项目。在登录页面中，我有四个选项卡。首先，登录页面必须出现。
为此，我把
rootPage:any = LoginPage
用于制作登录页作为根页面。
它工作得很完美。但我的问题是浏览器刷新，页面重新加载并再次导航到登录页面，而不是停留在当前页面。
我已经将根页面更改为当前页面名称，它工作得很好。但是我有两个包含不同选项卡的模块，因此我不能在rootPage中给出特定的选项卡名称。如何在浏览器刷新时将页面导航到当前页面？
浏览 21提问于2018-02-07得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM活动推荐
腾讯云开发者
