ion-side-menu 추가 후 ion-content가 보이지 않음

ionic framework로 모바일 앱을 만드는 법을 배웠습니다.ion-side-menu 추가 후 ion-content가 보이지 않음

원래 각 페이지마다 html과 css로 만들었으며 index.html 파일에는 사이드 메뉴를 추가하고 싶습니다. 코드를 추가하고 마침내 성공했습니다 ..

하지만 문제가 생깁니다. .. 헤더 아래에 표시되지 않습니다 ..

내가 내용을 추가하기 전에 내용이 나타나지 않는 이유는 모르겠지만 내용이 나타납니다.

이 내 코드 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> 

<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> 

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

<body ng-app="starter"> 

<ion-side-menus> 
<ion-side-menu-content> 
    <ion-header-bar class="bar-header bar-dark"> 
    <button class="button button-clear button-positive">Edit</button> 
    <div class="h1 title">23 Desember 20014</div> 
    <button class="button button-icon icon ion-navicon" menu-toggle="right"> </button> 
    </ion-header-bar> 
</ion-side-menu-content> 

<ion-side-menu side="right"> 
    <a menu-close href="#/home" class="item">Home</a> 
    <a menu-close href="#/home" class="item">Home</a> 
    <a menu-close href="#/home" class="item">Home</a> 
</ion-side-menu> 
</ion-side-menus> 

<!-- NOT APPEAR --> 
<ion-content> 
<div class="row green"> 
    <div class="col">Saldo</div> 
    <div class="col price">9,735,000</div> 
</div> 
<div class="row light-green"> 
    <div class="col">Income</div> 
    <div class="col price">3,550,000</div> 
</div> 
<div class="row pink expense-now"> 
    <div class="col"><strong>Expense</strong></div> 
</div> 
</ion-content> 
<!-- NOT APPEAR --> 

</body> 
</html>

이 내 코드는 app.js :

// Ionic Starter App 

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

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

function ContentController($scope, $ionicSideMenuDelegate) { 
    $scope.toggleLeft = function() { 
    $ionicSideMenuDelegate.toggleLeft(); 
    }; 
}

이 경우 저를 도와주세요, 사전에 감사의, 관련

출처

2015-01-26 afrila gunadi

사이드 메뉴 (http://ionicframework.com/docs/api/directive/ionSideMenus/) 및 데모 (http://codepen.io/ionic/pen/tcIGK)에 대한 설명서를 보면, 너는 안에 ion-side-menus 태그가 있어야한다.

Stackoverflow 내가 CodePen URL 승/O 코드를 제출하지 않도록 코드를 추가하기 만하면됩니다.

<ion-side-menus> 
    <!-- Center content --> 
    <ion-side-menu-content ng-controller="ContentController"> 
    </ion-side-menu-content> 

    <!-- Left menu --> 
    <ion-side-menu side="left"> 
    </ion-side-menu> 

    <!-- Right menu --> 
    <ion-side-menu side="right"> 
    </ion-side-menu> 
</ion-side-menus>

출처

2015-01-26 11:49:44

답장을 보내 주셔서 감사합니다. 그래서 내부 이온 쪽 메뉴에 내용이 바뀌고 작동합니다. –

ion-side-menu 추가 후 ion-content가 보이지 않음

답변

관련 문제