角度2：Ts：嵌套函数

Question

I'm working on a function and can someone give advice on how to specify a function that is out side a function? Inside the if statment I would like to call the otherfunction().

@Injectable()
export class menuService {
    constructor (){}
    testing(){ console.log('something')}
    loadwidget(){


           // not able to call this function
           this.testing()

    }
}

Error that i get is "this.testing is not a function"

ERROR TypeError: this.testing is not a function
    at Object.menuService.loadwidget (http://localhost:3000/main.bundle.js:755:14)
    at Object.eval [as handleEvent] (ng:///AppModule/tbuttonsComponent.ngfactory.js:36:41)
    at handleEvent (http://localhost:3000/vendor.dll.js:13146:138)
    at callWithDebugContext (http://localhost:3000/vendor.dll.js:14354:42)
    at Object.debugHandleEvent [as handleEvent] (http://localhost:3000/vendor.dll.js:13942:12)
    at dispatchEvent (http://localhost:3000/vendor.dll.js:10121:21)
    at http://localhost:3000/vendor.dll.js:10711:38

https://plnkr.co/edit/XCHsu19UhR9wWxz4VLOx?p=preview

Answer 1

That's exactly how you're supposed to access other methods within a class, off of the this keyword. If you're using your class above exactly as it's written out, then the issue is that variableName isn't defined anywhere within customfunction() so it errors out. The console.log() statement in otherfunction() never gets a chance to run because of that.

Edit: I took a look at the Plunker you added in, it turns out it's a scoping issue. I updated the menuService class, using arrow functions to implicitly bind this to menuService , and the third button started working as expected:

export class menuService {
  constructor (){
    // I moved this into the constructor and updated loadingwidget below
    this.menu = [{
      id: 1,
      loadingwidget: () => { this.loadwidget(); },
    }];
  }

  testing(){ 
    console.log('something');
    alert('something');
  }

  loadwidget(){
    this.testing();
  }
}

Here's a working version of your Plunker: https://plnkr.co/edit/sF08cccRb2b0xkfTspVV?p=preview

Answer 2

How you have defined should work. If otherfunction() isn't called check you if statement, maybe the comparison doesn't return what you expect.

Please look at this plunker example: https://plnkr.co/edit/4MWYDdeS5cCTDHI64HO2?p=preview

Answer 3

This is not because of Injectable and you don't need Injectable also as you are not injecting anything into the service. So you can omit that. But I could see there are few issue in the code like this one,

 menu = [
      {
        id = 1,
        loadingwidget: this.loadwidget
      }
    ]

where it should be

menu = [
      {
        id:1,
        loadingwidget: this.loadwidget
      }
    ]

and it was not compiled properly. It works just fine.