为什么

Question

我有一个按钮绑定到一个函数调用另一个函数从另一个组件打开模态窗体，作为参数传递客户名称和图标。

正常工作如果它被称为：

@Component({
    selector: 'app-customer',
    templateUrl: './customer.component.html',
    providers: [Items]
})

export class Costumers {
    @Input() customerNane

    Constructor() {}

    openDocs() {
         Items.prototype.OpenDocs(this.customerNane, "fa-book")`;
    }
}

但是，如果我在construtor上有它并称之为：

constructor(private items: Items) {}

 openDocs() {
    this.items.OpenDocs(this.customerNmane, "fa-book")`;
}

参数不会绑定。

有任何解释的责任！

更新.. items.component.ts

import { Component } from '@angular/core';
import { Http, Response, Headers, RequestOptions } from '@angular/http';
import { MainService } from '../services/main.service'

var JQuery = require('jquery');


@Component({
    selector: 'app-items',
    templateUrl: './items.component.html'

})


export class Items {
    public Title: string;
    public faAny: string;    

    vTypeList = [

        {
            vIdType: "",
            vDsType: ""
        }
    ]

    constructor(private http: Http, private mainService: MainService) {

    this.GetItemsType();
    }

    GetItemsType() {

        this.http.get('/Items/GetItemsType')
            .subscribe(data => {
                var ObjTp = JSON.parse(data.json());                
                for (var i in ObjTp) {
                    if (ObjTp[i] != null) {
                        this.vTypeList.push(ObjTp[i]);
                    }
                }              

            });

    }   


    OpenDocs(pTitle: string, pFaAny: string) {

        this.Title = pTitle;
        this.faAny = pFaAny;
        JQuery('#docs').modal('show');

    }

    private CloseDocs() {

            JQuery('#docs').css("display", "none");
            JQuery('#docs').modal('hide');

        }

    }

和绑定它的双向

 <h4 ng-model="Title" ><i class="fa {{faAny}}"></i> Add some list: {{Title}}</h4>

Answer 1

参数不会绑定。

使用箭头功能。改变

openDocs() {
    this.items.OpenDocs(this.customerNmane, "fa-book");
}

到

openDocs = () => {
    this.items.OpenDocs(this.customerNmane, "fa-book");
}

为什么

原因箭头功能确保正确this。

原型和TypeScript Angular 2

1 个答案:

为什么

更多