This change context and it's undefined angularjs

Question

I have function like below, and I have problem because of this context. When I run my code, I have error in my console: Cannot set property 'cat' of undefined When I change this.cat for $scope.cat, everything is fine. I tried add $scope.apply and timeout, but it doesn't works. It seems like this change context, but I dont't know how to repair it.

(function () {
    angular.module('test.module')
      .component('testComponent', {
        bindings: {},
        templateUrl: 'js/modules/test/test.html',
        controllerAs: 'vm',
        controller: (TestService, $scope) => {  

          TestService.changed(() => {
            const testValue = test.findById(id)

            if (testValue && testValue.data) {
              this.cat = testValue.data
            }
          })
       }
    })
  })()

felixmosh · Accepted Answer · 2019-03-12 11:40:06Z

1

The problem is that you are using arrowFunction as the controller, so, the this in that case would be the IFFE function that wraps the entire code.

You will need to change the arrowFunction to regular one, that will create a separate this context for it.

(function() {
  angular.module('test.module')
    .component('testComponent', {
      bindings: {},
      templateUrl: 'js/modules/test/test.html',
      controllerAs: 'vm',
      controller: function(TestService, $scope) {

        TestService.changed(() => {
          const testValue = test.findById(id)

          if (testValue && testValue.data) {
            this.cat = testValue.data
          }
        })
      }
    })
})()

answered Mar 12, 2019 at 11:40

felixmosh

35.8k10 gold badges81 silver badges99 bronze badges

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

Collectives™ on Stack Overflow

This change context and it's undefined angularjs

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related