جاوااسکریپت - تایپاسکریپت انگولارجیاس دسترسی به شیء فرم

من از AngularJS و Typescript استفاده میکنم.

من در تلاش برای دسترسی به شی فرم به مشکل خوردم.

در ادامه HTML من آمده است

    <form name="myForm" novalidate>

    <label>First Name</label>
<input type="text" ng-model="frm.FirstName" name="FirstName"    />
<button ng-click="logit()"></button>
</form>

حال میخواهم به شیء frm در کد تایپاسکریپت خود دسترسی پیدا کنم، کد من به صورت زیر است

module TestCtrl{
    interface ITestController{
        logit(): any;
    }

    class TestController implements ITestController{

        frm: any;
        constructor() {
            var vm = this;
            var frm = {};

        }

        logit(){
            var vm;
            console.log(frm.FirstName);
        }

    }

    angular.module('app').controller('TestCtrl', TestController);
}

کنسول میگوید frm تعریف نشده است. ایدهای دارید؟

پاسخ شماره ۱

باید شبیه این باشد:

module TestCtrl{
    interface ITestController{
        logit(): void;
        frm: any;
    }

    class TestController implements ITestController{

        frm: any;
        constructor() {
            var vm = this;
            vm.frm = {};

        }

        logit(){
            console.log(this.frm.FirstName);
        }

    }
    angular.module('app').controller('TestCtrl', TestController);
}

چیزی که باید به یاد داشته باشید این است که var vm=this; فقط یک روش برای ذخیره کردن محدوده فعلی شما است. و تایپاسکریپت از ابتدا کار خوبی در انجام این کار انجام میدهد. بنابراین به طور کلی فرقی نخواهد کرد که شما vm را قرار دهید یا نه.

شما همچنین ممکن است بخواهید به فکر تایپ کردن فرم خود نیز باشید.

interface IFormViewModel {
    firstName: string;
    lastName: string;
}

بدین ترتیب ITestController شما را ایجاد میکند

interface ITestController{
    logit(): void;
    frm: IFormViewModel;
}

class TestController implements ITestController{
    frm: IFormViewModel;

    constructor() {
        this.frm = {};
    }

    logit(){
        console.log(this.frm.firstName);
    }
}
angular.module('app').controller('TestCtrl', TestController);

پاسخ شماره ۲

در AngularJS، شما میتوانید به مدل داخل کنترلر با استفاده از متغیر $scope دسترسی پیدا کنید. در مورد شما، این خواهد بود

$scope.frm = {};
console.log($scope.frm.FirstName);