Simple example


#1

Hi all,

I would like to know a simple example about views, I was reading some articules but I still continue without understand very well how works?..

I’m new in ionic :slight_smile: but… I have created a simple application ( blank app)

And I have added this structure…

[…]

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

.state(‘name-resultado’, {
url: ‘/’,
views: {
‘name-resultado’: {
templateUrl: ‘templates/resultado.html’,
controller: function($scope){
console.log(“entro”);
}
}
}
})

[…]

so, I don’t understand where I need to put the view…

my index html…

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

<!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
<link href="css/ionic.app.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>
<ion-pane>
  <ion-header-bar class="bar-stable">
    <h1 class="title">{{header}}</h1>
  </ion-header-bar>
  <ion-content >

here…

  </ion-content>
</ion-pane>

and the last one…

my file “resultado.html”

Hello!

but… still contine without work :frowning:

can you help me?

Thanks in advance!!

Dan


#2

Hi,
I hope you know the basics of angular js and ionic framework directory structure.
Ionic framework users UI router similar to angular ng-route . Below is the link for the basics of ui-route

According to your code below

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

.state(‘name-resultado’, {
url: ‘/’,
views: {
‘name-resultado’: {
templateUrl: ‘templates/resultado.html’,
// you have to add your resultado.html in templates folder of your project .