My Understanding
In my experience with TypeScript and angular's ui state, I have utilized "type assertion" through the UI-Router definitely typed library.
By injecting $state into my code as shown below:
function myCtrl($state: ng.ui.IStateService){
// Some code
}
I am able to benefit from accurate autocompletion/error reporting for $state's methods.
Everything seems to be working smoothly up to this point.
The Issue
However, when attempting to access a property of params, like in this snippet:
function myCtrl($state: ng.ui.IStateService){
// Trying to access a property of $state.params
var example = $state.params.example;
}
An error message is displayed:
Property 'example' does not exist on IStateParamsService
This occurs because TypeScript is unaware of this specific property.
Approaches Considered
I pondered creating my own interface that extends ng.ui.IStateService
interface IMyState extends ng.ui.IStateService{
params: {
example: string;
};
}
And then assigning the type to my custom interface
function myCtrl($state: IMyState){
var example = $state.params.example;
}
By incorporating this approach, the error is eliminated.
What would be the appropriate type to utilize for $state?
Is defining a personalized interface similar to my illustration advisable?