Définition de contrôleur ionique

Question

Je suis assez nouveau pour angularjs et ionique et j'ai rencontré un problème. Ci-dessous j'ai posté du code depuis le fichier app.js, et j'ai remarqué que chaque fois que je définis un nouveau contrôleur (la ligne commentée), l'application ne se charge pas. J'ai comparé mon code à d'autres modèles d'application et il semble que tout ce qui est dans le fichier app.js soit correct, donc je ne comprends pas ce qui cause ce problème! Est-ce que quelqu'un a déjà vu quelque chose comme ça ??

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

    .state('app', { 
    url: '/app', 
    abstract: true, 
    templateUrl: 'templates/menu.html', 
    controller: 'AppCtrl' 
    }) 

    .state('app.userJobs', { 
    url: '/userJobs', 
    views: { 
     'menuContent': { 
     templateUrl: 'views/userJobs.html' 
    //  controller: 'ujobsCtrl' 
     } 
    } 

    }) 

Answer 1

Exactement as @Claies said, you would need to define the ujobsCtrl as a controller. Cette ligne que vous ne commentez pas n'est pas une définition - c'est en fait une demande pour le contrôleur ujobsCtrl; et si vous ne l'avez pas défini (je suppose que vous ne l'avez pas fait!), alors les choses ne fonctionneront certainement pas. Quelques documents à vérifier: ui-router's docs on controllers; puis AngularJS's docs on Controllers.

Le code suivant serait les options pour vous d'utiliser:

Option 1: Utilisez une fonction anonyme comme votre contrôleur:

.config(function($stateProvider, $urlRouterProvider) { 
    $stateProvider 
    .state('app', { 
     url: '/app', 
     abstract: true, 
     templateUrl: 'templates/menu.html', 
     controller: 'AppCtrl' 
    }) 
    .state('app.userJobs', { 
     url: '/userJobs', 
     views: { 
     'menuContent': { 
      templateUrl: 'views/userJobs.html' 
      // controller: 'ujobsCtrl' // <-- Can't use this, it's not defined 
      controller: function ($scope, $log){ 
      $log.log('yay!'); 
      } 
     } 
    } 
}) 

ou Option 2, où vous définissez un contrôleur distinct, nommé ujobsCtrl:

.config(function($stateProvider, $urlRouterProvider) { 
    $stateProvider 
    .state('app', { 
     url: '/app', 
     abstract: true, 
     templateUrl: 'templates/menu.html', 
     controller: 'AppCtrl' 
    }) 
    .state('app.userJobs', { 
     url: '/userJobs', 
     views: { 
     'menuContent': { 
      templateUrl: 'views/userJobs.html' 
      controller: 'ujobsCtrl' // <-- defined below, so we can now use this 
     } 
    } 
}) 
.controller('ujobsCtrl', function ($scope, $log){ 
    $log.log('yay!'); 
}) 

pour des applications plus importantes, l'option # 2 va être la plus propre d'avoir beaucoup de contrôleurs - vous pouvez briser ces derniers dehors en indi fichiers vidual dans un répertoire controllers/, et obtenez cette logique sur votre bloc .config et les définitions d'état. Pour une vérification de santé mentale, l'option # 1 est un bon point de départ.