Can'；t获取基本编辑模式以在Angular 8中工作

我习惯于Asp.NETMVC视图和使用Modals。通过使用ViewBags、TempData、隐藏输入等传递PartialView，您可以轻松创建共享模式模板并反复重用该模板。。。使用JavaScript

我是Angular的新手，我正在使用Bootstrap4。我可以很容易地创建一个模态来创建类似于employee对象的东西，但是我无法找到一个好的方法来使用模态编辑该对象。我可以创建一个编辑模式并使用JavaScript之类的东西来填充数据，但我不能通过单击按钮传递所有表单数据，也不能使用隐藏字段传递ID之类的所有数据

解决方案似乎是安装一个类似ngBootstrap的包，以便利用模式服务，在打开编辑模式时允许我传入employee对象。如果是这样，我将需要重构我的应用程序以使用ngBootstrap，因为它似乎不能很好地与JavaScript、jQuery和本机Bootstrap实现配合使用。我还必须构建模态和模态容器，我不知道如何重用它们

如果我使用模式服务，当我单击save按钮时，它会神奇地绑定employee对象的所有元素并传递所有数据（包括任何编辑和ID）？看来这才是安全套的真正好处

我需要安装类似ngBootstrap的东西才能获得这个基本功能吗

在Angular 8中是否有更好的方法

更新1

我希望this.formModel=content实际填充模式中的数据，但事实并非如此。如果我使用this.formModel.Name=“Test Name”，那就行了

this.service.findContent(id).subscribe(
      res => {

        var content = res as Content;

        let content2 = Object.assign(new Content(), res)

        //Full object is visible in console
        console.log('content', content);
        //undefined in console
        console.log('content2', content2.Name);

        //Does not populate any data in the form
        this.formModel = content;

        //This will populate Test Name in the Name field on the form 
        this.formModel.Name = "Test Name";

        //Just shows the Modal using Javascript
        this.popModal(content);
      },
      err => {
        console.log(err);
      }
    )

---

非常感谢您的帮助。谢谢

角度

Angular

因此，备选方案是：

• 创建自定义模式
• 使用类似于

  ngBooststrap

  或

  Angular Material

由Angular Material提供的对话框非常简单但功能强大

我没有使用

ngBooststrap

的经验，但它应该适合简单的用例

我需要安装类似ngBootstrap的东西才能获得这个基本功能吗

对。您应该安装诸如

@ng bootstrap/ng bootstrap

或

ngx bootstrap

之类的包装库，而不是使用OG bootstrap框架。创建这些包装器库，这样您就不必将jQuery与Angular一起使用。将jQuery与Angular一起使用并不符合“Angular精神”。使用jQuery可以做的事情，很可能也可以使用Angular。然而，当你的应用程序越来越大时，将jQuery和Angular混合在一起很可能会给你带来很多麻烦，特别是在变化检测问题和可能的安全问题上。我会指给你看，甚至是更多的信息

如果我使用模式服务，当我单击save按钮时，它会神奇地绑定employee对象的所有元素并传递所有数据（包括任何编辑和ID）？看来这才是安全套的真正好处

引导包装器库中的模式服务用于打开/关闭模式。例如。您可能只需要向服务提供您希望模态外观的外观和视图。这意味着您可以执行以下操作：

具有模态模板的组件

你想确认一下吗

对
不

confirm（）

方法仍然驻留在包含上述ng模板的同一组件中。就模型与表单的绑定而言，这是一个具有角度表单的完整的其他球类游戏。请注意，有两种形式的角度被动表单和模板驱动表单。看

在Angular 8中是否有更好的方法

---

在读了两遍你的文章后，我认为你想做的事情在角度上是非常简单的。然而，从你提问的措辞来看，你是个新手。如果我可以给你一个建议的话，我建议你每次只做一件事——先弄清楚角度形式是如何工作的，然后再尝试将其放入模态中，并尝试在组件之间来回传递数据。相信我，使用ngx bootstrap或ng bootstrap这样的包装库比使用OG bootstrap框架和jQuery和Angular要简单得多。

非常感谢您的详细解释。在阅读了有关表单和双向数据绑定的信息之后，我希望类似这样的东西能够在单击按钮时传递名称字段，而不必实际编辑表单中的名称字段$（'#myModal输入[name=name]'）.val（result.name）；实际上，这不起作用，我需要在开始使用ngBootstrap之前弄清楚原因。很有趣！如果编辑了名称字段，我只能使用this.formModel.Name获取名称。它看起来像$（'#myModal input[name=name]'）.val（result.name）；不会实际更新ViewModel或基础模型。这一定是我遇到的问题。知道为什么这个.formModel.Name=“Test”会填充模式中的名称字段吗，但是如果我使用这个.formModel=content；模式中没有填充任何数据。内容就是课堂。我已经在主问题的更新中添加了代码。嗨，很抱歉，我错过了通知栏中的后续问题（我单击通知栏后，通知栏将清除所有Noty）。我并不完全理解您的问题，因为您只提供了部分代码。我建议你问一个单独的问题，并提供一个最小的可重复的例子，这样其他人（甚至我自己）就能完全帮助你！