2016-10-18 9 views
3

Я столкнулся с действительно странной проблемой. Я следовал this tutorial. Моя цель состояла в том, чтобы реализовать два ионных представления, которые имеют ссылку друг на друга.Ion-view вообще не отображается

Моя проблема заключается в том, что при запуске приложения в браузере (Firefox) вызывается локальный адрес-адрес, но на экран ничего не отображается. Также нет ошибок, даже предупреждений на консольном выходе. Что еще более странно, так это то, что после публикации того же кода для кодировки он работает без проблем, see here. Единственное отличие в коду на моей машине есть ссылки на:

ionic.css 
ionic.bundle.js 

Те порождаются ионным на моей машине и отлично работает для других проектов. Я использую Linux (Mint) и Firefox в разработке. Я выложу весь свой код, но, как я уже сказал, нет никаких различий в кодеде.

Заранее благодарен!

index.html:

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width"> 
    <title>Title</title> 

    <link rel="manifest" href="manifest.json"> 

    <link href="lib/ionic/css/ionic.css" rel="stylesheet"> 
    <link href="css/style.css" rel="stylesheet"> 

    <!-- ionic/angularjs js --> 
    <script src="lib/ionic/js/ionic.bundle.js"></script> 

    <!-- cordova script (this will be a 404 during development) --> 
    <script src="cordova.js"></script> 

    <!-- your app's js --> 
    <script src="js/app.js"></script> 
    <script src="js/controllers.js"></script> 

    </head> 
    <body ng-app="starter" > 

     <ion-nav-view></ion-nav-view> 

     <script id="home.html" type="text/ng-template"> 
     <ion-view view-title="home"> 
      <ion-content ng-controller="HomeCtrl"> 
       <p>Lorem Ipsum bla bla bla…</p> 
      <a href="#/setViewer">View my set</a> 
      </ion-content> 
     </ion-view> 
     </script> 

     <script id="setViewer.html" type="text/ng-template"> 
     <ion-view view-title="SetViewer"> 
      <ion-content ng-controller="SliderCtrl"> 
         <p>Lorem Ipsum bla bla bla…</p> 
      <a href="#/home">Home</a> 
      </ion-content> 
     </ion-view> 
     </script> 

    </body> 
</html> 

controllers.js:

angular.module('starter',['ionic']) 
.controller('SliderCtrl',['$scope',function($scope){ 
    }]) 
    .controller('HomeCtrl',['$scope','$state',function($scope,$state){ 
    }]); 

app.js:

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

.run(function($ionicPlatform) { 
    $ionicPlatform.ready(function() { 
    if(window.cordova && window.cordova.plugins.Keyboard) { 
     // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard 
     // for form inputs) 
     cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true); 

     // Don't remove this line unless you know what you are doing. It stops the viewport 
     // from snapping when text inputs are focused. Ionic handles this internally for 
     // a much nicer keyboard experience. 
     cordova.plugins.Keyboard.disableScroll(true); 
    } 
    if(window.StatusBar) { 
     StatusBar.styleDefault(); 
    } 
    }); 
}) 

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

    $stateProvider 

    .state('index',{ 
     url: '/', 
     templateUrl: 'home.html', 
    controller: 'HomeCtrl' 
    }) 

    .state('setViewer',{ 
     url:'/setViewer', 
     templateUrl: 'setViewer.html', 
    controller: 'SlideCtrl' 
    }); 

    $urlRouterProvider.otherwise('/'); 

}); 

ответ

2

Таким образом, решение было то, что я перепутал файлы.

Как вы можете видеть в моем кодексе .module, объявления .config и .controller состоялись в одном документе. По сравнению с моей локальной структурой, где они были разделены между app.js и controllers.js.

Как только я разместил все эти объявления в одном файле, все работало нормально.

Смежные вопросы