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

时间:2019-06-19 14:19:32

标签: typescript nativescript nativescript-angular

错误

预期2个参数,但得到1.ts(2554) core.d.ts(8064,47):未提供“ opts”参数。

代码来自NativeScript市场

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

我已经逐字逐句地处理了代码,并且在导出类中遇到了错误

@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}")
        });
    }
}

预期的输出是在仿真器加载时应检测到已注销的用户并向他们显示登录页面。

2 个答案:

答案 0 :(得分:2)

那是因为新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

答案 1 :(得分:0)

检查您的角度版本。对于版本8,添加{ static: true }

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

如果版本为9+,请在运行开发服务器之前执行npm install