Currently, I am in the process of creating my initial typescript controller and encountering a slight challenge in comprehending how to utilize $scope effectively in order to reference elements within various code blocks. Below is the relevant snippet of code :
module app.controllers {
class TeamsController implements app.domain.Team {
// Various properties defined here
static $inject = ['dataAccessService', '$http', '$scope'];
// Constructor function with dependencies injected
constructor(private dataAccessService: app.common.DataAccessService, $http: ng.IHttpService, $scope: ng.IScope) {
this.teams = [];
this.divisions = [];
this.coaches = [];
this.httpService = $http;
// Retrieving resources using dataAccessService
var teamResource = dataAccessService.getTeamResource();
var divisionResource = dataAccessService.getDivisionResource();
var coachResource = dataAccessService.getCoachResource();
// Querying resources for data retrieval
teamResource.query((data: app.domain.Team[]) => {
this.teams = data;
});
divisionResource.query((data: app.domain.Division[]) => {
this.divisions = data;
});
coachResource.query((data: app.domain.Coach[]) => {
this.coaches = data;
});
// Instantiating necessary objects
this.selectedTeam =
new app.domain.Team(0, "", new app.domain.Coach(0, ""), new app.domain.Division(0, ""), "", "", "", "");
this.teamToBeUpdated =
new app.domain.Team(0, "", new app.domain.Coach(0, ""), new app.domain.Division(0, ""), "", "", "", "");
}
// Add or Update Team function
addUpdateTeam(): void {
if (this.teamToBeUpdated.teamId === 0) {
// Additional functionality to be included here
// Performing a post request
this.httpService.post('http://localhost:33201/api/Teams/Add', this.teamToBeUpdated)
.then(function (response) {
// Handling success case
this.teams.push(response.data);
this.teams.sort(function (a, b) {
if (a.teamName.toLowerCase() < b.teamName.toLowerCase()) return -1;
if (a.teamName.toLowerCase() > b.teamName.toLowerCase()) return 1;
return 0;
});
this.teamToBeUpdated =
new app.domain.Team(0, "", new app.domain.Coach(0, ""), new app.domain.Division(0, ""), "", "", "", ""); // Clear form after submission
}, function (error) {
// Handling failure
})
.finally(function () {
});
}
}
}
// Registration of the controller
angular.module("app")
.controller("teamsController", ['dataAccessService', '$http', '$scope', TeamsController]);
}
In the section where this is used above, I aim to replace it with $scope, however, an error '{propertyname} does not exist on type IScope' is raised whenever I attempt to do so. Could someone provide guidance on the correct approach to accomplish this?