i got a problem when i try my html. and when i see on web element i got this error "Cannot read property 'controller' of undefined"
this is my app.js
angular.module('underscore', [])
.factory('_', function() {
return window._; // assumes underscore has already been loaded on the page
});
// angular.module is a global place for creating, registering and retrieving Angular modules
// 'starter' is the name of this angular module example (also set in a <body> attribute in index.html)
// the 2nd parameter is an array of 'requires'
angular.module('your_app_name', [
'ionic',
'angularMoment',
'your_app_name.controllers',
'your_app_name.directives',
'your_app_name.filters',
'your_app_name.services',
'your_app_name.factories',
'your_app_name.config',
'your_app_name.views',
'underscore',
'ngMap',
'ngResource',
'ngCordova',
'slugifier',
'ionic.contrib.ui.tinderCards',
'youtube-embed'
])
.run(function($ionicPlatform, PushNotificationsService, $rootScope, $ionicConfig, $timeout) {
$ionicPlatform.on("deviceready", 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();
}
PushNotificationsService.register();
});
// This fixes transitions for transparent background views
$rootScope.$on("$stateChangeStart", function(event, toState, toParams, fromState, fromParams){
if(toState.name.indexOf('auth.walkthrough') > -1)
{
// set transitions to android to avoid weird visual effect in the walkthrough transitions
$timeout(function(){
$ionicConfig.views.transition('android');
$ionicConfig.views.swipeBackEnabled(false);
console.log("setting transition to android and disabling swipe back");
}, 0);
}
});
$rootScope.$on("$stateChangeSuccess", function(event, toState, toParams, fromState, fromParams){
if(toState.name.indexOf('app.feeds-categories') > -1)
{
// Restore platform default transition. We are just hardcoding android transitions to auth views.
$ionicConfig.views.transition('platform');
// If it's ios, then enable swipe back again
if(ionic.Platform.isIOS())
{
$ionicConfig.views.swipeBackEnabled(true);
}
console.log("enabling swipe back and restoring transition to platform default", $ionicConfig.views.transition());
}
});
$ionicPlatform.on("resume", function(){
PushNotificationsService.register();
});
})
.config(function($stateProvider, $urlRouterProvider, $ionicConfigProvider) {
$stateProvider
.state('head', {
url: "/head",
abstract: true,
templateUrl: "views/app/head.html",
controller: 'HeadCtrl'
})
.state('head.merchantlist', {
url: "/merchantslist",
views: {
'merchantsmenuContent': {
templateUrl: "views/app/merchant/merchantspec-list.html",
controller: "MerchantlistCtrl"
}
}
})
;
// if none of the above states are matched, use this as the fallback
$urlRouterProvider.otherwise('/head/merchantslist');
});
this is my controller.js
angular.module('your_app_name.controllers', [])
.controller('HeadCtrl', function ($scope, $ionicConfig) {
})
.controller('MerchantlistCtrl', function ($scope) {
})
this is my 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">
<meta http-equiv="Content-Security-Policy" content="default-src *; script-src 'self' 'unsafe-inline' 'unsafe-eval' *; style-src 'self' 'unsafe-inline' *">
<title></title>
<link href="css/ionic.app.css" rel="stylesheet">
<link href="lib/ionic-contrib-tinder-cards/ionic.tdcards.css" rel="stylesheet">
<script src="https://maps.google.com/maps/api/js"></script>
<script src="https://www.youtube.com/iframe_api"></script>
<script src="lib/ionic/js/ionic.bundle.js"></script>
<script src="lib/angular-resource/angular-resource.min.js"></script>
<script src="lib/underscore/underscore-min.js"></script>
<script src="lib/ngmap/build/scripts/ng-map.min.js"></script>
<script src="lib/ngCordova/dist/ng-cordova.min.js"></script>
<script src="lib/moment/min/moment.min.js"></script>
<script src="lib/angular-moment/angular-moment.min.js"></script>
<script src="lib/angular-slugify/dist/angular-slugify.min.js"></script>
<script src="lib/collide/collide.js"></script>
<script src="lib/ionic-contrib-tinder-cards/ionic.tdcards.js"></script>
<script src="lib/ngCordova/dist/ng-cordova.min.js"></script>
<script src="lib/angular-youtube-mb/dist/angular-youtube-embed.min.js"></script>
<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
<script src="js/directives.js"></script>
<script src="js/filters.js"></script>
<script src="js/services.js"></script>
<script src="js/factories.js"></script>
<script src="js/views.js"></script>
<script src="js/config.js"></script>
</head>
<body ng-app="your_app_name">
<ion-nav-view></ion-nav-view>
</body>
</html>
this is my head.html
<ion-nav-bar class="bar app-top-bar">
<ion-nav-back-button></ion-nav-back-button>
<ion-nav-bar>
<ion-nav-view name="merchantsmenuContent"></ion-nav-view>
and this is my merchants
<ion-view class="merchantspec-view">
<ion-nav-title>
<span>Restaurants</span>
</ion-nav-title>
<ion-content>
</ion-content>
</ion-view>
