角型サービスをコントローラで使用する方法 - タイプスクリプト

Question

typescriptを使用してangularjsを書き込もうとしていますが、今は止まっています。 AgeServiceという名前のサービスが1つあります。そのサービスにはcalculateAgeという名前の関数があります。私のコントローラにそれを呼んでいますが、私は以下に書いたエラーを受けています。

SERVICE.TS

var servicesModule = angular.module('services', []); 
class AgeService { 
    static AngularDependency = [AgeService]; 
    constructor(private $scope: ng.IScope) { 

    } 
    public calculateAge(birthdate: string) { 
     var today = new Date(); 
     var dob = new Date(Date.parse(birthdate)); 

     var years = today.getFullYear() - dob.getFullYear(); 
     if (today.getMonth() < dob.getMonth() || (today.getMonth() == dob.getMonth() && today.getDate() < dob.getDate())) 
      years -= 1; 
     return years; 
    } 
} 

servicesModule.service('ageService', AgeService.AngularDependency) 

CONTROLLER.TS

var controllersModule = angular.module('controllers', []); 
class PersonController { 
    static AngularDependency = ['$scope', PersonController, 'ageService']; 

    constructor(private $scope: PersonScope, private ageService: AgeService) { 
     this.initController(); 
    } 

    private initController() { 
     this.$scope.name = 'Berkin'; 
     this.$scope.person = { 
      name: 'Berkin', 
      dob: '25-06-1995' 
     }; 
     this.$scope.person.age = this.ageService.calculateAge(this.$scope.person.dob); 
    } 

} 

controllersModule.controller('personController', PersonController.AngularDependency); 

HTML

<h4 ng-controller="personController">{{name}} {{person.age}}</h4> 

ERROR

@Rahulが言ったようにの

おかげで...

Answer 1

SOLUTION

はまず、私はモジュールに私のコードを包みます。

その後、私はAngularDependency配列に "PersonController"変数を省略します。

「サービス」モジュールを「コントローラ」モジュールにインポートして、AgeServiceのサマリーを作成します。

すべてがうまくいきます。

CONTROLLER.TS

module Application.Controller { 
import Services = Application.Services; 

class PersonController { 
     static AngularDependency = ['$scope', 'ageService']; 
     ageService: Application.Services.AgeService; 
     constructor(private $scope: PersonScope, ageService: Application.Services.AgeService) {   
      this.ageService = ageService; 
      this.initController(); 
     } 

     private initController() { 
      this.$scope.name = 'Berkin'; 
      this.$scope.person = { name: 'Berkin', dob: '01-01-1995' }; 
      this.$scope.person.age = this.ageService.calculateAge(this.$scope.person.dob); 
     } 
    } 
} 

SERVICES.TS

module Application.Services { 
    var servicesModule = angular.module('services', []); 

    export class AgeService { 
     static AngularDependency = [AgeService]; 

     public calculateAge(birthdate: string) { 
      var today = new Date(); 
      var dob = new Date(Date.parse(birthdate)); 
      var years = today.getFullYear() - dob.getFullYear(); 
      if (today.getMonth() < dob.getMonth() || (today.getMonth() == dob.getMonth() && today.getDate() < dob.getDate())) 
       years -= 1; 
      return years; 
     } 
    } 

    servicesModule.service('ageService', AgeService); 
} 

これらのステップはあなたのために十分でない場合は、お知らせください。ありがとう

Answer 2

App.filter('ageFilter', function() { 
    //<input type="text" ng-model="employee.birthday | ageFilter" class="form-control" disabled/> 
    function calculateAge(birthday) { // birthday is a 
     var birthday = new Date(birthday); 
     var NOW = Date.now(); 
     var ageDifMs = NOW - birthday.getTime(); 
     var ageDate = new Date(ageDifMs); // miliseconds from epoch 
     return Math.abs(ageDate.getUTCFullYear() - 1970); 
    } 
    function monthDiff(d1, d2) { 
     if (d1 < d2){ 
     var months = d2.getMonth() - d1.getMonth(); 
     return months <= 0 ? 0 : months; 
     } 
     return 0; 
    } 

    return function(birthdate) { 
     if(angular.isUndefined(birthdate) || birthdate instanceof Date){ return ""; }else{ 

      return calculateAge(birthdate); 
     } 
    }; 
});