我正在使用离子,我有以下观点:
<ion-view hide-nav-bar="true" ng-controller="loginController" class="login-view">
<ion-content class="padding">
<div class="row row-center">
<div class="col">
<div id="logo"></div>
<form>
<div class="list">
<label class="item item-input">
<input type="text" placeholder="Membership No" ng-model="membershipNo">
</label>
<label class="item item-input">
<input type="password" placeholder="Password" ng-model="password">
</label>
</div>
<button class="button button-block button-positive button-login" ng-click="login()">
Login
</button>
</form>
</div>
</div>
</ion-content>
</ion-view>
Run Code Online (Sandbox Code Playgroud)
而我的控制器:
app.controller('loginController', ['$scope', '$localstorage',
function($scope, $localstorage) {
$scope.membershipNo;
$scope.password;
$scope.login = function () {
console.log("User logged in with membership no: " + $scope.membershipNo +
"\n and password: " + $scope.password);
}
} …Run Code Online (Sandbox Code Playgroud) 我有一个应用程序,可以从我的Wordpress网站上读取最新帖子并将其显示在列表中.问题是,每次用户重新打开应用程序时,即使我的网站上有新帖子,它也会加载旧的(缓存的)文章列表.
在禁用离子缓存方面,我已经完成了所有这些工作:
我已经定了 $ionicConfigProvider.views.maxCache(0);
我的模板的第一行是这样的: <ion-view class="home-view" cache-view="false">
尝试设置cache: false在.state('app.home')
尝试加载这样的状态:$state.go('app.home', {}, {reload : true});没有按预期工作.
尝试在简历上清除这样的缓存: $ionicHistory.clearHistory(); $ionicHistory.clearCache();
甚至在简历上尝试了类似的东西$route.reload,$window.location.reload但它不起作用.
他们都没有工作.我在这里结束了!
请帮忙!
我正在尝试将我的应用程序连接到本地存储,以便我可以将数据保存在用户设备上,而不是每次关闭应用程序时都重置.我唯一的问题是我无法弄清楚实际将本地存储链接到我的对象数组.任何帮助是极大的赞赏.我添加了任何我认为相关的代码.
app.js
// Ionic Starter App
// angular.module is a global place for creating, registering and retrieving Angular modules
// 'starter' is the name of this angular module example (also set in a <body> attribute in index.html)
// the 2nd parameter is an array of 'requires'
// 'starter.services' is found in services.js
// 'starter.controllers' is found in controllers.js
angular.module('gas-mileage-tracker', ['ionic', 'ionic.utils', 'gas-mileage-tracker.controllers', 'gas-mileage-tracker.services'])
.run(function($ionicPlatform) {
$ionicPlatform.ready(function() {
// Hide the accessory bar by default (remove this to show the accessory …Run Code Online (Sandbox Code Playgroud) 据我所知,这可能更像是一个AngularJS问题,而不是一个特定的Ionic问题.我的一个观点中有一个按钮:
<button class="button button-clear button-block button-positive" ui-sref="register">
Register
</button>
Run Code Online (Sandbox Code Playgroud)
在我的控制器中,我有这个变量,我从本地存储得到的是真或假,必须隐藏,具体取决于值:
app.controller('loginController', ['$scope', '$localstorage',
function($scope, $localstorage) {
// Check if the user has already requested a register, and if true, hide
// the 'Register' button
if ($localstorage.get("registrationRequested", false) === true) {
// How do I do this?
}
}]);
Run Code Online (Sandbox Code Playgroud)
现在第一个问题可能是,从控制器那里操纵dom是一种最佳实践吗?如果没有,我在哪里以及如何做到这一点?如果它在我的控制器中做得很好,那我该如何引用该按钮并隐藏它?
我打算在离子应用程序启动时在默认页面中渲染选项卡和导航栏.
我已经能够从互联网上获取这些确切的功能,并且点击并尝试.但是我仍然不确定在应用程序的同一页面上使用导航栏和选项卡这一点很重要.
我有一个名为的文件menu.html,其中包含导航栏的代码.
它看起来像这样:
<ion-side-menus>
<ion-side-menu-content>
<ion-nav-bar class="bar-light">
<ion-nav-back-button>
</ion-nav-back-button>
<ion-nav-buttons side="left">
<button class="button button-icon button-clear ion-navicon" menu-toggle="left">
</button>
</ion-nav-buttons>
<!-- <ion-nav-buttons side="right">
<button class="button button-icon button-clear ion-more" menu-toggle="right">
</button>
</ion-nav-buttons>
</ion-nav-bar>
-->
<ion-nav-buttons side="right">
<button class="button button-icon ion-more" ng-click="popover.show($event)"></button>
</ion-nav-buttons>
<ion-nav-view name="menuContent"></ion-nav-view>
</ion-side-menu-content>
<ion-side-menu side="left">
<ion-header-bar class="bar-assertive">
<h1 class="title">Left Menu</h1>
</ion-header-bar>
<ion-content>
<ul class="list">
<a href="#/menu/tabs" class="item" menu-close>Tabs</a>
<a href="#/menu/home" class="item" menu-close>About</a>
</ul>
</ion-content>
</ion-side-menu>
<!-- <ion-side-menu side="right">
<ion-header-bar class="bar-assertive">
<h1 class="title">Right menu</h1>
</ion-header-bar>
<ion-content>
<ul class="list" …Run Code Online (Sandbox Code Playgroud) 我有一个带有4个幻灯片的离子滑动盒.您可以通过单击屏幕底部的按钮在幻灯片之间切换.当相应的幻灯片处于活动状态时,如何将类"活动"(使用AngularJS)添加到按钮?
例如,如果第二张幻灯片处于活动状态,我希望第二个按钮让课程"有效".当您移动到第三张幻灯片时(通过单击第三个按钮或滑动屏幕),类"活动"将从第二个按钮中删除并添加到第三个按钮.
这是我的代码:
menu.html
<ion-view view-title="Menu">
<ion-content class="padding">
<ion-slide-box on-slide-changed="activateTabs($index)">
<ion-slide>
<h1> Slide 1 </h1>
</ion-slide>
<ion-slide>
<h1> Slide 2 </h1>
</ion-slide>
<ion-slide>
<h1> Slide 3 </h1>
</ion-slide>
<ion-slide>
<h1> Slide 4 </h1>
</ion-slide>
</ion-slide-box>
</ion-content>
<div class="button-bar">
<a class="button button-stable" ng-click="slide(0)">1</a>
<a class="button button-stable" ng-click="slide(1)">2</a>
<a class="button button-stable" ng-click="slide(2)">3</a>
<a class="button button-stable" ng-click="slide(3)">4</a>
</div>
</ion-view>
Run Code Online (Sandbox Code Playgroud)
MenuCtrl.js
myApp
.controller('MenuCtrl', function($scope, $stateParams, $ionicSlideBoxDelegate){
$scope.slide = function(to) {
$scope.current = to;
$ionicSlideBoxDelegate.slide(to);
}
});
Run Code Online (Sandbox Code Playgroud)