カスタムモデルの入力データを親モデルプロパティにバインドしようとしています: カスタム要素のthis.fieldValueは、最終的にコンテナのregistration.firstNameプロパティにバインドされる必要があります。親ページ。 関連のコードを参照してください: これは、カスタム要素のHTMLです:カスタムモデル入力へのモデルモデルプロパティのバインド
<template>
<label>
${title}<input name.bind="fieldName" custom-type="text"
title.bind="title" focusout.trigger="focusoutAction()" />
</label>
</template>
これは、ビューモデル(簡体字)です:カスタム要素で
import {inject, bindable, customElement, bindingMode} from
'aurelia-framework';
@customElement('form-input')
@inject(Element)
export class FormInputCustomElement {
@bindable({ defaultBindingMode: bindingMode.twoWay }) value;
@bindable title;
@bindable customType;
@bindable placeHolder;
@bindable fieldName;
@bindable onFocusout;
constructor(element) {
this.element = element;
this.input = null;
this.fieldValue = '';
}
bind(bindingContext) {
this.input = this.element.getElementsByTagName("input")[0];
this.input.type = this.customType || "text";
this.input.placeholder = this.placeHolder || "";
}
focusoutAction() {
this.fieldValue = this.input.value;
this.onFocusout();
}
}
私はthis.fieldValueが得ることがわかります入力テキスト。 これは、コンテナ関連するコードです:問題は、私はcreateNewAccount機能に到達したときに、 this.registration.firstNameが空であることである
import { inject, bindable } from 'aurelia-framework';
export class AccountRegistration {
constructor() {
this.initRegistration();
}
initRegistration() {
this.registration = {};
this.registration.firstName = '';
}
createNewAccount() {
var a = this.registration.firstName;
}
:
<template>
<require from="./../../formControllers/formInput"></require>
<div>
${fieldValue}<form-input name="firstName" id="firstName" field-
value.bind="registration.firstName" title="First Name"
validate="registration.firstName" place-holder="Enter first name" field-
name="firstName" on-focusout.call="validateInput()" />
</div>
<button type="button" click.delegate="createNewAccount()">Create New
Account</button>
そして、これはクラス関連するコードですカスタムエレメントの入力テキストに設定されているカスタムエレメント フィールド値(camelCaseのfieldValue)プロパティにバインドされています。 ここで何が間違っていますか?