Question

我在控制台中遇到了一些错误，并且不确定HTML中的问题是什么。任何帮助将不胜感激。

error_handler.js：51 EXCEPTION：Uncaught（in promise）：错误：模板解析错误：意外结束标记＆＃34; div＆＃34; （＆＃34;点击此处注册 [错误 - ＆gt;]＆＃34;）：ResetPassword @ 22：1错误：模板解析错误：意外结束标记＆＃34; div＆＃34; （＆＃34;点击此处注册 [错误 - ＆gt;]＆＃34;）：ResetPassword @ 22：1

<section class="reset-password">
<div class="container container-responsive inner-top-xs">
    <form [formGroup]="resetPasswordForm" (ngSubmit)="resetPassword(resetPasswordForm.value, resetPasswordForm.valid)">
        <h4>Please enter your e-mail address and a temporary password will be sent to you.</h4>
        <div class="form-group">
            <label class="control-label" for="email">Email</label>
            <input type="text" formControlName="email" required class="form-control" id="email" placeholder="Email">
            <validation-message [control]="resetPasswordForm.controls.email"></validation-message>
        </div>
        <button type="submit" class="btn btn-flat__blue outer-top-xs" [disabled]="!resetPasswordForm.valid">RESET PASSWORD</button>
    </form>
    <div class="alert alert-dismissible alert-danger outer-top-xs" *ngIf="errorMessage && !successMessage"">
      <button type="button" class="close" data-dismiss="alert">&times;</button>
      {{errorMessage}}
    </div>
    <div class="alert alert-dismissible alert-success outer-top-xs" *ngIf="successMessage">
      <button type="button" class="close" data-dismiss="alert">&times;</button>
      {{successMessage}}
    </div>
    <div class="outer-top-xs">
        <a [routerLink]="['/getstarted']">Click here to Signup</a>
    </div>
</div>
</section>

Answer 1

*ngIf="errorMessage && !successMessage""：

，你有一个双引号太多了

<div class="alert alert-dismissible alert-danger outer-top-xs" *ngIf="errorMessage && !successMessage"> 
<!--at the end of this line-->

Answer 2

当您打开元素并且不关闭它时，会发生此错误。此错误显示在此示例中：

@model BudoschoolTonNeuhaus.Models.TeamMember

@{
    ViewBag.Title = "Create";
    Layout = "~/Views/Shared/_Admin_Layout.cshtml";
}
<div class="wrapper">
    <h2>Create</h2>

    @using (Html.BeginForm())
    {
        @Html.AntiForgeryToken()

        <div class="form-horizontal">
            <h4>TeamMember</h4>
            <hr />
            @Html.ValidationSummary(true, "", new { @class = "text-danger" })
            <div class="form-group">
                @Html.LabelFor(model => model.FristName, htmlAttributes: new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.EditorFor(model => model.FristName, new { htmlAttributes = new { @class = "form-control" } })
                    @Html.ValidationMessageFor(model => model.FristName, "", new { @class = "text-danger" })
                </div>
            </div>

            .... // controls for other properties of model

            <div class="form-group">
                @Html.LabelFor(model => model.DanGrades, htmlAttributes: new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.EditorFor(model => model.DanGrades, new { htmlAttributes = new { @class = "form-control" } })
                    @Html.ValidationMessageFor(model => model.DanGrades, "", new { @class = "text-danger" })
                </div>
            </div>

            <div class="form-group">
                @Html.LabelFor(model => model.Image, htmlAttributes: new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    <input type="file" id="Image" name="Image" hidden />
                </div>
            </div>

            <div class="form-group">
                <div class="col-md-offset-2 col-md-10">
                    <input type="submit" value="Create" class="btn btn-default" />
                </div>
            </div>
        </div>
    }

    <div>
        @Html.ActionLink("Back to List", "Index")
    </div>
</div>

如您所见，我不会关闭<ion-list *ngSwitchCase="'facilities'"> <ion-item *ngFor="let facility of facilities"> <ion-icon name="facility.Icon" item-start></ion-icon> {{facility.Name}} <ion-icon color="red" name="rose" item-end></ion-icon> </ion-item> <ion-list>元素（应为<ion-list>）

小心：

如果您使用任何元素属性及其值，因为解析器无法处理它们，则会打开该元素并发生此错误（＆＃34;＆＃34;在上面的示例中）。

意外的结束标记＆＃34; div＆＃34;错误angular2 HTML

2 个答案: