Can I use Typescript classes as AngularJS controllers using the new 'controller as' syntax

Question

I'm working on a web app using AngularJS and Typescript and I'm trying to find the best way to take advantage of Typescript when it comes to defining controllers. Intuitively a controller would just be a TypeScript class but AngularJS wants you to put everything into the $scope variable.

In the lasted Alpha release of AngularJS (1.1.5) they have added a new 'controller as' syntax. I've heard that this new syntax should help integrate with languages like Coffeescript and TypeScript but I don't quite understand how. If anyone has a sample of using this new syntax with TypeScript or CoffeeScript or can provide some insight into how it could be done I'd greatly appreciate it.

Thanks!

basarat · Accepted Answer · 2013-05-30 03:42:35Z

3

Yes it works fine. Just create your class e.g MainController. Then in your view use ng-controller='MainController as vm'. All properties of MainController class become members of $scope.vm

answered May 30, 2013 at 3:42

basarat

278k61 gold badges475 silver badges528 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

rob Over a year ago

So all I have to do is create a class who's name matches whatever is in ng-controller and angular will call it's constructor? Also if I put parameters like $location and $log in the constructor will they be injected?

basarat Over a year ago

@rob yup. Just make sure the generated js is loaded.

csharon · Accepted Answer · 2013-06-03 23:50:39Z

1

This is what worked for me with CoffeeScript classes.

class MainCtrl
  newThing: ""
  constructor: (@model)->

  someThings: ->
    @model.awesomeThings

  addThing: ->
    @model.addThing(@newThing)


app.controller 'MainCtrl', ['ThingService', (model)-> 
    new MainCtrl(model)
]

You can see the full example on my plunk.

answered Jun 3, 2013 at 23:50

csharon

211 bronze badge

Collectives™ on Stack Overflow

Can I use Typescript classes as AngularJS controllers using the new 'controller as' syntax

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related