[英]what is the best way to write the code in ionic
I am using ionic framework and here is my code 我正在使用离子框架,这是我的代码
<ion-side-menus>
<!-- Center content -->
<ion-nav-bar class="bar-positive nav-title-slide-ios7 has-tabs-top">
<ion-nav-buttons side="left">
<button class="button button-icon icon ion-navicon" ng-click="toggleDrawer()">
</button>
</ion-nav-buttons>
</ion-nav-bar>
<ion-side-menu-content>
<ion-view title="Home Page">
<ion-content>
hello
</ion-content>
</ion-view>
</ion-side-menu-content>
<!-- Left menu -->
**
<--below is common code in all files --->**
<drawer side="left">
<ion-nav-bar class="bar-stable nav-title-slide-ios7 has-tabs-top">
<ion-nav-buttons side="left">
<button class="button button-icon icon ion-navicon" ng-click="toggleDrawer()">
</button>
</ion-nav-buttons>
</ion-nav-bar>
<ion-view title="Categories">
<ion-content>
<ion-list>
<ion-item data-ng-repeat="category in categories">{{category.category_name}}</ion-item>
</ion-list>
</ion-content>
</ion-view>
</drawer>
</ion-side-menus>
the following code is common amongnt all files 以下代码在所有文件中是通用的
<ion-list>
<ion-item data-ng-repeat="category in categories">{{category.category_name}}</ion-item>
</ion-list>
and controller 和控制器
.controller('MainCtrl', ['$scope', '$http', function($scope, $http) {
$http({
url: 'getCateogroies.php',
method: 'GET',
withCredentials: true,
})
.success((function(data) {
$scope.categories = data;
})
.error(function(data) {
alert("Login failed");
})
});
Now problem is that it is sending server request on each page load. 现在的问题是,它在每次页面加载时都发送服务器请求。 I want to send it once since we already have the list.
我想发送一次,因为我们已经有了列表。
How can we do this? 我们应该怎么做?
Thanks 谢谢
You can use factory
as a provider for accessing the data in any controller. 您可以将
factory
用作提供程序来访问任何控制器中的数据。
.factory('shareData', function($http) {
var data = "undefined";
return {
getValueFromServer: function() {
//your HTTP call
data = your_response_object;
},
displayValue: function() {
return data;
}
}
});
So, in your main controller, you will inject the factory and call getValueFromServer()
and fetch the data and store it in a var declared in your factory data
. 因此,在主控制器中,您将注入工厂并调用
getValueFromServer()
并获取数据并将其存储在工厂data
声明的var中。 And then fetch the value by calling displayValue()
: 然后通过调用
displayValue()
获取值:
.controller('MainCtrl', function($scope, shareData) {
shareData.getValueFromServer();
$scope.display_t = shareData.displayValue();
})
And in the rest controllers, you just need to call displayValue()
: 在其余的控制器中,您只需要调用
displayValue()
:
.controller('OtherCtrl', function($scope, shareData) {
$scope.display_again = shareData.displayValue();
})
I have created a Codepen having a factory - http://codepen.io/keval5531/pen/ZGEZMw 我创建了具有工厂的Codepen- http ://codepen.io/keval5531/pen/ZGEZMw
You should move the $http out into a Service and inject the Service into the controller. 您应该将$ http移出服务,然后将服务注入控制器。
.service('categoryService', ['$http', function ($http) {
function getCategories(){
return $http(/*your request here, withouth the .success, .error*/);
}
return{
getCategories: getCategories
}
}]);
Then in your controller: 然后在您的控制器中:
.controller('MainCtrl', ['$scope','categoryService',function ($scope, categoryService) {
categoryService.getCategories().then(function(success){
$scope.categories = success.data;
})
}]);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.