Angular js - 从控制器调用data-modal-target

时间:2022-01-22 10:49:02

I am new to angular and have a question about modal. In my html I have am using data-modal-target like this

我是棱角分明的新人,对模态有疑问。在我的HTML中,我正在使用像这样的数据模态目标

          <li>
            <button data-modal-target='#delete-connection' ng-click="deleteConnection(cloudconnection.id)">Delete Connection</button>
          </li>

I have a div with id delete-connection defined in my html which has contents of modal dialog like OK/Cancel. The above code works just fine and I see a modal dialog when button is clicked.

我在我的html中定义了一个id为delete delete-connection的div,其中包含模态对话框的内容,如OK / Cancel。上面的代码工作得很好,我看到单击按钮时的模态对话框。

But now I want to show this modal dialog from my controller. When button is clicked I want to call a method in the controller, do some processing there and then show the modal dialog conditionally. What's the easiest way to show that modal dialog? One way that I have seen in other answers is to define its own controller with template file etc. I am wondering if I can just use my existing div for modal dialog and somehow enable it from my controller. I tried something like -

但现在我想从我的控制器显示这个模态对话框。单击按钮时,我想调用控制器中的方法,在那里进行一些处理,然后有条件地显示模态对话框。显示模态对话框的最简单方法是什么?我在其他答案中看到的一种方法是使用模板文件等定义自己的控制器。我想知道我是否可以使用我现有的div进行模态对话,并以某种方式从我的控制器启用它。我试过像 -

$('#delete-connection').modal();

$( '#删除连接')模态()。

But I get a reference error stating $ is not defined.

但我得到一个引用错误,说明$未定义。

Can someone suggest what I should do here?

有人可以建议我应该在这做什么吗?

Thanks

谢谢

2 个解决方案

#1


0  

Its because you havn't included jquery refernce.

因为你没有包括jquery引用。

If you need to do angular way try using angular-ui

如果你需要做角度方式尝试使用angular-ui

https://angular-ui.github.io/bootstrap/#!#modal

https://angular-ui.github.io/bootstrap/#!#modal

#2


0  

This error can only be caused by one of following:

此错误只能由以下之一引起:

  1. JavaScript file is not being properly loaded into your page
  2. JavaScript文件未正确加载到您的页面中
  3. You have a botched version of jQuery. This could happen because someone edited the core file, or a plugin may have overwritten the $ variable.
  4. 你有一个拙劣的jQuery版本。这可能是因为有人编辑了核心文件,或者插件可能覆盖了$变量。
  5. You have JavaScript running before the page is fully loaded, and as such, before jQuery is fully loaded.
  6. 您在页面完全加载之前运行JavaScript,因此,在jQuery完全加载之前。

Make sure all javascript code is being run inside a code block such as:

确保所有javascript代码都在代码块中运行,例如:

$(document).ready(function () {
  //your code here
});

This will ensure that your code is being loaded after jQuery has been initialized. One final thing to check is to make sure that you are not loading any plugins before you load jQuery. Plugins extend the "$" object, so if you load a plugin before loading jQuery core, then you'll get the error you described.

这将确保在初始化jQuery之后加载代码。最后要检查的是确保在加载jQuery之前没有加载任何插件。插件扩展了“$”对象,所以如果你在加载jQuery核心之前加载一个插件,那么你将得到你描述的错误。

#1


0  

Its because you havn't included jquery refernce.

因为你没有包括jquery引用。

If you need to do angular way try using angular-ui

如果你需要做角度方式尝试使用angular-ui

https://angular-ui.github.io/bootstrap/#!#modal

https://angular-ui.github.io/bootstrap/#!#modal

#2


0  

This error can only be caused by one of following:

此错误只能由以下之一引起:

  1. JavaScript file is not being properly loaded into your page
  2. JavaScript文件未正确加载到您的页面中
  3. You have a botched version of jQuery. This could happen because someone edited the core file, or a plugin may have overwritten the $ variable.
  4. 你有一个拙劣的jQuery版本。这可能是因为有人编辑了核心文件,或者插件可能覆盖了$变量。
  5. You have JavaScript running before the page is fully loaded, and as such, before jQuery is fully loaded.
  6. 您在页面完全加载之前运行JavaScript,因此,在jQuery完全加载之前。

Make sure all javascript code is being run inside a code block such as:

确保所有javascript代码都在代码块中运行,例如:

$(document).ready(function () {
  //your code here
});

This will ensure that your code is being loaded after jQuery has been initialized. One final thing to check is to make sure that you are not loading any plugins before you load jQuery. Plugins extend the "$" object, so if you load a plugin before loading jQuery core, then you'll get the error you described.

这将确保在初始化jQuery之后加载代码。最后要检查的是确保在加载jQuery之前没有加载任何插件。插件扩展了“$”对象,所以如果你在加载jQuery核心之前加载一个插件,那么你将得到你描述的错误。