Question

在devextreme表单上，您会看到添加的参考变量＆＃34; #mail＆＃34;，＆＃34; #twitter＆＃34;和＆＃34; #phone＆＃34;。我试图将每个输入的值传递给一个函数，但这些函数返回一个未定义的对象。

    <div class="jumbotron">

    <h1>:(</h1>
    <h2>
    Sorry, this feature is not yet implemented. Please subscribe and we will let you know when the feature is complete.
    </h2>
</div>

<div>
    <dx-form [colCount]="1"
             labelLocation="left">
        <dxi-item #email dataField="Email Address"></dxi-item>
        <dxi-item #twitter dataField="Twitter"></dxi-item>
        <dxi-item #phone dataField="Phone Number"></dxi-item>

    </dx-form>        

    <div class="buttonContainer">
        <dx-button text="Subscribe"
                   type="success"
                   icon="check"
                   (click)="onSubscribe(email.value, twitter.value, phone.value)">
        </dx-button>
    </div>

</div>

如果我使用常规输入元素，则值确实按预期传递给函数：

<input #email placeholder="email">
<input #twitter placeholder="twitter">
<input #phone placeholder="phone number">

该函数只是返回一个控制台消息：

onSubscribe(emailAddress: string, twitterHandle: string, phoneNumber: string) {    
    console.log(emailAddress, twitterHandle, phoneNumber);      
}

如何使用这些变量引用将输入值传递给函数？

Answer 1

dxi-item没有value属性。您可以定义一个模板，其中包含一个带有如下引用的编辑器：

<dxi-item>
    <dxo-label text="e-mail"></dxo-label>
    <dx-text-box #email [(value)]="data.email"></dx-text-box>
</dxi-item>
...
{{email.value}}

在devextreme表单上使用时，引用变量未定义

1 个答案: