The page is blank


#1

Hi! I have the following code and gives me an error:

 I have the following code and gives me an error:

app.factory('buscarnoticias',function($http){
  return{
    noticiajson: function(){
      var url = "xxxxx?callback=JSON_CALLBACK";
      $http.get(url)
        .success(function(data){
          return data;
      });
    }
  }
});


app.service('ultimasService', function($q,buscarnoticias) {
  return {
    noticias: function(){
      var datos = buscarnoticias.noticiajson();
      return datos;
    },
    GetNoticias: function() {
      return this.noticias();
    },
    GetNoticia: function(noticiaId) {
      var dfd = $q.defer()
      this.noticias().forEach(function(noticia) {
        if (noticia.id === noticiaId) dfd.resolve(noticia);
      });

      return dfd.promise;
    }
  }
});



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

    .state('app.ultimasNoticias', {
      url: "/ultimasNoticias",
      views: {
        'menuContent' :{
          templateUrl: "templates/ultimasNoticias.html",
          controller: 'ultimasCtrl',
          resolve: {
            noticias: function(ultimasService) {
              return ultimasService.GetNoticias()
            }
          }
        }
      }
    })

    .state('app.ultimasNoticiasDetail', {
      url: "/ultimasNoticiasDetail/:noticiaId",
      views: {
        'menuContent' :{
          templateUrl: "templates/ultimasNoticiasDetail.html",
          controller: 'ultimasDetailCtrl',
          resolve: {
            noticia: function($stateParams, ultimasService) {
              return ultimasService.GetNoticia($stateParams.noticiaId)
            }
          }
        }
      }
    });
 $urlRouterProvider.otherwise('/app/ultimasNoticias');
  });

Error:

The page is blank


#2

and your views / templates look like what ?

you can always run ionic serve and use chrome debugger to see what is the issue with your code and why you have a white page


#3

Others controllers:

app.controller('ultimasCtrl', function($scope, noticias) {
  $scope.noticias = noticias
});

app.controller('ultimasDetailCtrl', function($scope, noticia) {
  $scope.noticia = noticia
});

view ultimasNoticias.html

<ion-view title="Últimas Noticias">
  <ion-nav-buttons side="left">
    <button menu-toggle="left" class="button button-icon icon ion-navicon"></button>
  </ion-nav-buttons>
  <ion-content class="sombraInterna">

    <div>
    	<div class="card" ng-repeat="noticia in noticias"> 
        <ul>
           <li class="arrow">
            <a href="#/app/ultimasNoticiasDetail/{{noticia.id}}">
               <div>
                 <span class="item item-thumbnail-unaLinea">
                   <img src="http://xxxx/{{noticia.Imagen}}">
                   <p class="padding-vertical"><b>{{noticia.Titulo}}</b></p>
                 </span>            
               </div>
              <p align="justify" class="padding-horizontal" ng-bind-html="noticia.DescripcionLarga | hrefToJS"></p>
            </a>
           </li>
        </ul>
    	</div>      
    </div>
  
  </ion-content>
</ion-view>

view ultimasNoticiasDetail.html

<ion-view title="Últimas Noticias">
  <ion-nav-buttons side="left">
    <button menu-toggle="left" class="button button-icon icon ion-navicon"></button>
  </ion-nav-buttons>
  <ion-content class="sombraInterna">

    <div>
      <div class="card">
        <center>
          <h3 class="padding-vertical">{{noticia.Titulo}}</h3>
          <img style="max-width:100%;" src="xxxx/{{noticia.Imagen}}">
        </center>
        <p align="justify" class="padding">{{noticia.DescripcionLarga}}</p>
      </div>
    </div>
  
  </ion-content>
</ion-view>

I used Chrome debugger and is blank…