Javascript 如何从指令链接方法-Angularjs中调用js插件

我试图用一个角度指令来包装Bootstrap3的模态。我进入了link函数，但无法调用Bootstrap

.modal（）

函数。这是我的html：

<h1>This is a test!!!</h1>
<button ng-click="test()">This is a button</button>

<div id="myModal" class="modal fade" bsmodal>
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title">Modal title</h4>
      </div>
      <div class="modal-body">
        <p>One fine body&hellip;</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

当我到达

元素.modal（'show'）

时，我得到了一个错误，

TypeError:Object没有方法“modal”

。

元素

对象看起来像一个

jQuery

包装的对象，但它仍然没有方法。我不明白的是，我可以在link函数中调用

$（'myModal'）.modal（）

，一切都正常工作

所以我的问题是

元素

和

jQuery

包装对象之间有什么区别？（他们看起来一样）

如何调用link函数中

元素

上的

modal（）

函数

---

Angular使用了

jQuery

，

jqLite

的简化版本

---

看起来您正在页面中加载jQuery。如果在angular之前加载它，angular将使用它而不是使用

jqLite

，并且您应该能够调用

元素。模态（'show'）

angular使用了

jQuery

，

jqLite

的简化版本

---

看起来您正在页面中加载jQuery。如果在angular之前加载它，angular将使用它而不是使用

jqLite

，您应该能够调用

元素。modal（'show'）

，

我知道它提供了

jQuery

提供的函数的子集，因此，我猜这意味着它没有与

jQuery

相同的插件结构？@jhamm插件，如果您使用

jqLite

，那么将自身附加到

jQuery

对象的插件将无法访问，是的。但是，如果在angular之前加载了

jquery

，则

$（'myModal'）

和

元素之间应该没有区别。试试看是否有效。我知道它提供了
jQuery
提供的一部分功能，所以我猜这意味着它没有与
jQuery
相同的插件结构？@jhamm插件，如果您使用
jqLite
，那么连接到
jQuery
对象的插件将无法访问，是的。但是，如果在angular之前加载了
jquery
，则
$（'myModal'）
和
元素之间应该没有区别。试试看是否有效。
App.directive('bsmodal', function() {
  return {
    restrict: 'A',
    link: function(scope, element, attrs) {
      element.modal('show');
    }
  };
});