angular-ui route won't load controller

Question

    .state('app.match.indicator.speciality',{
      url: '/speciality/:jobId?',
      views: {
        'sidebar@app.match.indicator':{
          templateUrl: ENVApp + '/views/match/match.roleProfileSideBar.html?' + cacheVersion,
        },
        'createRoles@app.match.indicator': {
          templateUrl: ENVApp + '/views/match/match.page2.html?' + cacheVersion
        }
      },
      controller: 'RoleProfileCreateSpecialtyController'
    })

That's what I have as a state definition, however my RoleProfileCreateSpecialtyController doesn't get loaded for some reason. I know this because I threw an alert in there that never happens.

What am I doing wrong?

This also fails:

    .state('app.match.indicator.speciality',{
      url: '/speciality/:jobId?',
      views: {
        'sidebar@app.match.indicator':{
          templateUrl: ENVApp + '/views/match/match.roleProfileSideBar.html?' + cacheVersion,
        },
        'createRoles@app.match.indicator': {
          templateUrl: ENVApp + '/views/match/match.page2.html?' + cacheVersion
        }
      },
      // controller: 'RoleProfileCreateSpecialityController'
      controller: function() {
        alert('fd')
      }
    })

Remove the quotes around the controller name. I'm assuming your importing it, too? — rrd, Dec 08 '16 at 15:34
Then you probably have console errors like 'cannot find controller' — devqon, Dec 08 '16 at 15:36
That doesn't do it. Even if I put a controller name that doesn't exist, I get no error — Shamoon, Dec 08 '16 at 15:39
It seems that if you have multiple views, your controller won't work. You have to define a controller per-view — devqon, Dec 08 '16 at 15:52
Is there any way to have one controller for both views? According to http://stackoverflow.com/a/29708369/239879, it looks possible — Shamoon, Dec 08 '16 at 15:57
Possible duplicate of [UI-Router Multiple Views Single Controller not work](http://stackoverflow.com/questions/33134124/ui-router-multiple-views-single-controller-not-work) — Walfrat, Dec 08 '16 at 16:11

score 2 · Accepted Answer · edited May 23 '17 at 12:24

When defining multiple views in a state, you cannot define a single controller (see https://stackoverflow.com/a/33139917/3153169 for reference).

To fix this, you can just define the controller for the multiple views:

.state('app.match.indicator.speciality',{
    url: '/speciality/:jobId?',
    views: {
        'sidebar@app.match.indicator':{
            templateUrl: ENVApp + '/views/match/match.roleProfileSideBar.html?' + cacheVersion,
            controller: 'RoleProfileCreateSpecialtyController'
        },
        'createRoles@app.match.indicator': {
            templateUrl: ENVApp + '/views/match/match.page2.html?' + cacheVersion,
            controller: 'RoleProfileCreateSpecialtyController'
        }
    }
})

As an addendum for the OP : read this link in the answer link by devqon : http://stackoverflow.com/q/29107012/1679310. You will probably need it. — Walfrat, Dec 08 '16 at 16:11

angular-ui route won't load controller

1 Answers1