Aurelia 验证规则:出现错误 "Unable to parse accessor function"

Aurelia Validation Rules: Getting error "Unable to parse accessor function"

我发现 出现了同样的错误,但是在我的例子中,模型是使用接口构建的,所以我想通过这个例如 ValidationRules.ensure((c: Client) => c.client.clientLastName) 访问它,但我认为我的语法不正确。

它是一个打字稿实现。

我用另一种形式(登录)工作,这是一种基本形式,但这个使用输入界面。如果我使用没有基于接口的变量的简单绑定,它就可以工作。

这是我的单个文本输入的验证规则 - clientLastName

ValidationRules.ensure((c: Client) => c.client.clientLastName)
    .displayName("Last name")
    .required()
    .on(Client);

aurelia-logging-console.js:47 ERROR [app-router] Error: Unable to parse accessor function: function (c) { return c.client.clientLastName; }

视图结构如下:

    <div class="col-md-6">
        <div class="form-group">
            <label class="control-label col-md-3">Last Name:</label>
            <div class="col-md-9">
                <input type="text" value.bind="client.clientLastName & validate" class="form-control" id="lastname" placeholder="Last Name...">
            </div>
        </div>
    </div>

当通过设置为接口的变量进行绑定时,如何进行语法验证?

界面:

    interface ClientDetails {

        clientId: number;
        clientNo: number;
        company: boolean;
        companyName: string;
        abn: string;
        isWarrantyCompany: boolean;
        requiresPartsPayment: boolean;
        clientFirstName: string;
        clientLastName: string;
        email: string;
        mobilePhone: string;
        phone: string;
        notes: string;

        address: AddressDetails;

        jobs: any;

        bankName: string;
        bankBSB: string;
        bankAccount: string;
        active: boolean;
        deActivated: string;
        activity: boolean;
        dateCreated: string;
        dateUpdated: string;

        creatorId: number;
        creatorName: string;
    }

我的视图模型:

import { HttpClient } from "aurelia-fetch-client";
import { autoinject, inject, NewInstance, PLATFORM } from "aurelia-framework";
import { Router, activationStrategy } from "aurelia-router";
import {
    ValidationControllerFactory,
    ValidationController,
    ValidationRules
} from "aurelia-validation";

import { BootstrapFormRenderer } from "../../../../services/bootstrapFormRenderer/bootstrapFormRenderer";
//import  from '../../../../services/customValidationRules/customValidationRules'

import { AuthService } from "../../../../services/auth/auth-service"

@autoinject
export class Client {
    controller: ValidationController;
    client: ClientDetails;
    hasClientId: boolean;
    heading: string = "New Client";
    headingIcon: string = "fa-user-plus";


    constructor(
        private authService: AuthService,
        private router: Router,
        private controllerFactory: ValidationControllerFactory
    ) {
        this.router = router;
        this.controller = controllerFactory.createForCurrentScope();
        this.controller.addRenderer(new BootstrapFormRenderer());

    }

    // Required to reload new instance.
    determineActivationStrategy() {
        return activationStrategy.replace; 
    }

    activate(parms, routeConfig) {
        this.hasClientId = parms.id;

        if (this.hasClientId) {
            const headers = this.authService.header();

            fetch("/api/Client/edit/" + parms.id, {
                method: "GET",
                headers
            })
                .then(response => response.json())
                .then(data => {
                    console.log("data: ", data);
                    this.client = data
                    console.log("CLIENT: ", this.client);
                })
            this.heading = "Edit Client"; // An id was submitted in the route so we change the heading as well.
            this.headingIcon = "fa-pencil-square-o";
        }
        return null;
    }

    submitClient() {
        console.log("gets  Here")

    }
}

我认为

ValidationRules.ensure((c: Client) => c.client.clientLastName)
.displayName("Last name")
.required()
.on(Client);

应该是

ValidationRules.ensure((c: ClientDetails) => c.clientLastName)
.displayName("Last name")
.required()
.on(ClientDetails);

另见