controllerAs

1

Hi,

I know ionic is based on ui-router, but I was wondering if the “controller as” exists or does it have a similar equivalent?

Thanks

2

it exists, it is an angular js language feature

Digging into Angular’s “Controller as” syntax http://bit.ly/1m2DYUB

1 Like
3

You are right, it is an Angular feature, but do you think that code below should work?

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

  $stateProvider
    .state('sitesView', {
      url: "/sitesView",
      templateUrl: "Views/sitesView.html",
      controller: "SitesViewCtrl",
      controllerAs: "sitesView"
    });

   $urlRouterProvider.otherwise("/sitesView");

});
1 Like
4 
myApp.config(function($stateProvider, $urlRouterProvider) {

  $stateProvider
    .state('sitesView', {
      url: "/sitesView",
      templateUrl: "Views/sitesView.html",
      controller: "SitesViewCtrl as sitesView"
    });

   $urlRouterProvider.otherwise("/sitesView");

});
9 Likes
5

COOL! I did not know about that.

Thanks Aaron

6

You can also use the controllerAs config as another option under controller if you like that syntax better.

1 Like
7

@dave, I cannot get the controllerAs syntax to work. Please see this demo. Note the Home and the Facts views.

8

Yeah it doesn’t look the controllerAs config works in the latest Ionic Config - believe this is a ui-router issue not an Ionic one.

9

What I’ve found that does work is:

controller: 'RestockItemsController as restock',

Where sometimes the controllerAs syntax does not.

2 Likes
10

controllerAs is still not working:/ why?

2 Likes
11

Ionic still doesn’t seem to work with the controllerAs syntax. See this issue on the repo about it (with a work around).

12

I came across this issue, and found that was recently solved in ionic 1.1.1 “yttrium-yeti” (2015-11-05)

Features:
navView: support ControllerAs syntax for ion-nav-views (a665d1d)

13

Looks like last post was November of 2015, but I’m having an odd issue…

It seems that controllerAs only works within a normal route-definition and not within the views: { ... } block. I hate it and its stupid. May be an angular-ui thing.

Cheers,

Cody