预期有 2 个参数，但得到 1.ts(2554) core.d.ts(8064, 47)：未提供 'opts' 的参数

Question

错误

需要 2 个参数，但得到了 1.ts(2554) core.d.ts(8064, 47)：未提供 'opts' 的参数。

代码来自 NativeScript Marketplace

https://play.nativescript.org/?template=play-ng&id=Hqp5UQ&v=3073

我已经逐字记录了代码，但在 class

上导出时出现错误

@ViewChild("password") password: ElementRef;
@ViewChild("confirmPassword") confirmPassword: ElementRef;

有谁知道如何解决这个问题？

import { Component, ElementRef, ViewChild } from "@angular/core";
import { alert, prompt } from "tns-core-modules/ui/dialogs";
import { Page } from "tns-core-modules/ui/page";
import { RouterExtensions } from "nativescript-angular/router";

import { User } from "../shared/user.model";
import { UserService } from "../shared/user.service";

@Component({
    selector: "app-login",
    moduleId: module.id,
    templateUrl: "./login.component.html",
    styleUrls: ["./login.component.css"]
})
export class LoginComponent {
    isLoggingIn = true;
    user: User;
    processing = false;
    @ViewChild("password") password: ElementRef;
    @ViewChild("confirmPassword") confirmPassword: ElementRef;

    constructor(private page: Page, private userService: UserService, private routerExtensions: RouterExtensions) {
        this.page.actionBarHidden = true;
        this.user = new User();
        this.user.email = "user@nativescript.org";
        this.user.password = "password";
    }

    toggleForm() {
        this.isLoggingIn = !this.isLoggingIn;
    }

    submit() {
        if (!this.user.email || !this.user.password) {
            this.alert("Please provide both an email address and password.");

            return;
        }

        this.processing = true;
        if (this.isLoggingIn) {
            this.login();
        } else {
            this.register();
        }
    }

    login() {
        this.userService.login(this.user)
            .then(() => {
                this.processing = false;
                this.routerExtensions.navigate(["/home"], { clearHistory: true });
            })
            .catch(() => {
                this.processing = false;
                this.alert("Unfortunately we could not find your account.");
            });
    }

    register() {
        if (this.user.password !== this.user.confirmPassword) {
            this.alert("Your passwords do not match.");

            return;
        }
        this.userService.register(this.user)
            .then(() => {
                this.processing = false;
                this.alert("Your account was successfully created.");
                this.isLoggingIn = true;
            })
            .catch(() => {
                this.processing = false;
                this.alert("Unfortunately we were unable to create your account.");
            });
    }

    forgotPassword() {
        prompt({
            title: "Forgot Password",
            message: "Enter the email address you used to register for APP NAME to reset your password.",
            inputType: "email",
            defaultText: "",
            okButtonText: "Ok",
            cancelButtonText: "Cancel"
        }).then((data) => {
            if (data.result) {
                this.userService.resetPassword(data.text.trim())
                    .then(() => {
                        this.alert(`Your password was successfully reset. Please check your email for
                        instructions on choosing a new password.`);
                    }).catch(() => {
                        this.alert("Unfortunately, an error occurred resetting your password.");
                    });
            }
        });
    }

    focusPassword() {
        this.password.nativeElement.focus();
    }
    focusConfirmPassword() {
        if (!this.isLoggingIn) {
            this.confirmPassword.nativeElement.focus();
        }
    }

    alert(message: string) {
        return alert({
            title: "APP NAME",
            okButtonText: "OK",
            message: ("{message}")
        });
    }
}

预期的输出是当模拟器加载时它应该检测到已注销的用户并向他们显示登录页面。

Answer 1

那是因为新 Angular 中的突破性变化。您需要像下面这样通过

@ViewChild("password", { static: true }) password: ElementRef;
@ViewChild("confirmPassword", { static: true }) confirmPassword: ElementRef;

引入了一个新的静态标志来不破坏现有的应用程序，所以如果你想在切换到 Ivy 时保持旧的行为，你可以这样写：

@ViewChild('password', { static: true }) static: ElementRef<HTMLDivElement>;

您可以在这里进一步阅读：https://angular.io/api/core/ViewChild#description

Answer 2

检查你的 angular 版本。对于版本 8，添加 { static: true } .

@ViewChild("password", { static: true }) password: ElementRef;
@ViewChild("confirmPassword", { static: true }) confirmPassword: ElementRef;

如果版本是 9+，在运行 dev server

之前执行 npm install

预期有 2 个参数，但得到 1.ts(2554) core.d.ts(8064, 47)：未提供 'opts' 的参数

Expected 2 arguments, but got 1.ts(2554) core.d.ts(8064, 47): An argument for 'opts' was not provided

typescript

nativescript

nativescript-angular