使用ngForm时关闭Angular材质对话框?

时间:2018-08-03 17:12:01

标签: angular dialog angular-material angular-forms

如果使用ngForm,如何关闭对话框?在弹出此对话框之前,我使用了两个对话框,并且我了解您使用[mat-dialog-close] =“ true”然后使用MAT_DIALOG_DATA作为数据。但是在最后一个上,我使用ngForm,以便可以使用提交的数据,这些数据最终通过.filter()运行以创建新的数组。然后,使用此数组,我使用服务将其发送到其他组件,在该组件中,我使用该数组并使用.map()制作geojson传单层。一切正常,但现在我必须单击关闭对话框以将其关闭?我可以在onSubmit函数中放一些东西吗?我应该在对话之外执行此操作吗?

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace menu
{
    class Program
    {
        enum header { id, name, surname, addres };

        public static int id = 1;

        static void Main(string[] args)
        {
            string[,] matrix = new string[10, 4];

            insertStudent(matrix);
            idSearch(matrix);
            Console.ReadKey();
        }


        static int generateId()
        {
            return id++;
        }

        static void insertStudent(string[,] matrix)
        {
            int n = generateId();
            matrix[n - 1, 0] = Convert.ToString(n);

            for (int i = 1; i < matrix.GetLength(1); i++)
            {
                do
                {
                    Console.WriteLine($"Insert {Enum.GetName(typeof(header), i)}");
                    matrix[n - 1, i] = Console.ReadLine();
                }

                while (String.IsNullOrEmpty(matrix[n - 1, i]));

            }
        }

            static void idSearch(string[,] matrix)

        {
            int idChosen=0;
            Console.WriteLine($"Insert ID you want to visualize:");
            int.TryParse(Console.ReadLine(), out idChosen);
            for (int i = 0; i < matrix.GetLength(0); i++)
            {
                for (int j = 0; j < matrix.GetLength(1); j++)
                {


                    if (matrix[i, 0] == Convert.ToString(idChosen))
                    {
                        Console.WriteLine(matrix[i, j]);
                    }
                    else
                    {
                        Console.WriteLine("The chosen ID does not exist");
                    }

                }

            }
        }









    }

}

我尝试仅使用不带方括号的mat-dialog-close并将其关闭,但是ngForm提交没有起作用。.我计划很快在这里进入反应式,但是如果有一种更简便的方法可以让它我知道!谢谢。

1 个答案:

答案 0 :(得分:1)

两个选项:

A:通过提交处理程序关闭:

请参见also this example

<div mat-dialog-content>
    <form [formGroup]="form" (submit)="submitForm()">
        ...
    </form>
</div>

public submitForm(): void {
    ...
    this.matDialogReference.close([]);
}

B:通过点击处理程序关闭:

另请参阅this complete example

<div mat-dialog-title>
    <h2 class="dialog-title">dialog title</h2>

    <a (click)="closeDialog()">
        <span class="icon-close"></span>
    </a>
</div>

<div mat-dialog-actions>
    <button mat-raised-button (click)="closeDialog()">cancel</button>
    <button mat-raised-button (click)="confirmDialog()">confirm</button>
</div>

public closeDialog(): void {
    this.matDialogReference.close([]);
}

public confirmDialog(): void {
    this.matDialogReference.close(this.form.value);
}

B当您单击关闭图标或取消按钮或提交按钮时,关闭对话框。