在ios Ionic Framework

时间:2015-12-05 21:11:07

标签: javascript ios angularjs ionic-framework ionic

我是Ionic Framework的新手,但我已经面临图像加载的问题。

这是我通过get response

从服务器获取图像'url的对象

我可以通过chrome的工具“Check element”看到图片的布局,但我在页面上根本看不到它们,它们只是不可见。

也许我首先需要在缓存中加载它们然后显示它们或者smth?

所以,这是代码:

这是app.js文件:

angular.module('starter', ['ionic', 'starter.controllers', 'starter.services'])

.run(function($ionicPlatform) {

$ionicPlatform.ready(function() {

if(window.cordova && window.cordova.plugins.Keyboard) {
  cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
}

if(window.StatusBar) {
  StatusBar.styleDefault();
}
});

})

.config(function($stateProvider, $urlRouterProvider) {

$stateProvider

.state('main', {
url: "/main",
templateUrl: "templates/main.html",
controller: 'ImagesDashCtrl'
});

$urlRouterProvider.otherwise('/main');

});

这是一个controllers.js:

angular.module('starter.controllers', [])

.controller('ImagesDashCtrl', function($scope, myImages) {

 $scope.images = [];

 $scope.loadImages = function() {

myImages.getDownloadedImages().then(function(images){
  $scope.images = images;
});
}

});

这是services.js:

angular.module('starter.services', [])

 .factory('myImages', function($http) {

  var myDownloadedImages = [];

   return {

     getDownloadedImages: function() {

  return $http.get('http://www.test1.com').then(function(response) {
              myDownloadedImages = response.data;
              return myDownloadedImages;
          });

}

} });

在main.html中只是从图像中进行简单的ng-repeat等等,我也在index.html中使用“ion-nav-view”

非常感谢

1 个答案:

答案 0 :(得分:0)

首先:似乎你永远不会执行$scope.loadImages函数。

有两种参考图像的方法

一种方法是手动下载它们并将它们放在离子应用程序中的图像文件夹中,然后您可以像在任何Web应用程序中一样简单地引用它们。 (然后是当地的)

另一个是你在互联网上引用它们。 因此,您使用图像的绝对URL并将其下载。

我会推荐第一种方式。