Angularjs with Coffeescript class

Question

I was trying angularjs with Coffescript class

I was able to inject and able to do a successful example using coffeescript. But to access $scope I have to write functions within the constructor. What I can do to get it out of it. If there is another good way to write that please let me know.

Here is my working coffeescript code

class PersonCtrl
    @$inject = ['$scope']

    constructor: (@scope) ->
        @scope.persons = [
            firstName:"Kunjan"
            lastName:"Dalal"
        ,
            firstName:"Kunj"
            lastName:"Dalal"
        ]

        @scope.addPerson = () =>
            @scope.persons.push angular.copy @scope.person

Please let me know if any further details required.

malix · Accepted Answer · 2015-04-08 07:17:41Z

11

I have used the following syntax:

app = angular.module 'myapp', []

class MySimpleCtrl

  @$inject: ['$scope'] 
  constructor: (@scope) ->
    @scope.demo = 'demo value'
    @scope.clearText = @clearText

  clearText: =>
    @scope.demo = ""

app.controller 'MySimpleCtrl', MySimpleCtrl

angular.bootstrap document, ['myapp']

Take a look at this jsFiddle: http://jsfiddle.net/jwcMA/

UPDATE @oto-brglez the .bootstrap() call replaces having ng-app on your <html> tag

UPDATE @TylerCollier, this was a while back, now I would probably use the Controller As notation (or maybe TypeScript!)

COFFEE

class PetController 
    constructor: (@$scope) ->
        @pets = ['Fido','Felix']
    addPet: (pet) ->
        @pets.push(pet)

HTML

<div ng-controller="PetController as pc">
...
<li ng-repeat="pet in pc.pets">

edited Apr 8, 2015 at 7:17

answered Aug 12, 2013 at 18:01

malix

3,5921 gold badge33 silver badges41 bronze badges

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

4 Comments

kunjee Over a year ago

Okies, So, I was missing registering of scope in constructor. Thanks that thing make sense at least for javascript.

Oto Brglez Over a year ago

@malix could you please explain the propose of last line?

Tyler Collier Over a year ago

For each method you want to add, you have to also map it in the constructor? @scope.clearText = @clearText

malix Over a year ago

@TylerCollier, this was a while back, now I would probably use the Controller As notation, or better yet, TypeScript :)

Collectives™ on Stack Overflow

Angularjs with Coffeescript class

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related