问AngularJS可以与jQuery bootgrid一起使用吗？
EN

Stack Overflow用户

提问于 2017-11-30 22:06:59

回答 0查看 290关注 0票数 0

在阅读了两天关于jQuery Bootgrid和AngularJS的所有主题后，我仍然不能在我生成的网格上使用angular指令。

我使用的是AngularJS 1.6.6和jQuery Bootgrid 1.3.1。使用它的页面运行良好，网格之外的所有元素都在使用angular指令。所有元素都在正确的ng-app和ng-controller标记的根目录中。

问题是，我在网格中有一些按钮，它们都丢失了事件，比如onclick、工具提示等。所以我想使用ng-click而不是jQuery函数(.click () {})来映射它们。

没有错误消息，只有事件没有触发。

指令中指向的所有函数都在我的作用域中声明。

我几乎可以得出结论，jQuery Bootgrid隔离了它自己的作用域，并避免了angular进入其中。这会继续吗？

<html lang="en">
    <head>
        <title>Example - jQuery Bootgrid and Angular</title>
        <meta charset="utf-8">
        <script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
        <script src="https://cdn.bootcss.com/jquery-bootgrid/1.3.1/jquery.bootgrid.min.js"></script>
        <link href="https://cdn.bootcss.com/jquery-bootgrid/1.3.1/jquery.bootgrid.css" rel="stylesheet" />
        <script src="https://code.angularjs.org/1.6.6/angular.min.js"></script>
        <script>
            var app = angular.module('app', []).controller('appController', ['$scope', function ($scope) {
                $scope.test = function () {
                    alert('Clicked!');
                }
                $("#grid-basic").bootgrid({
                    templates: {
                        search: '<div class="search form-group"><div class="input-group"><span class="icon glyphicon input-group-addon glyphicon-search"></span> <input type="text" ng-click="test()" class="search-field form-control" placeholder="Pesquisar"></div></div>'
                    }
                });
            }]);
        </script>
    </head>
    <body ng-app="app" ng-controller="appController">
        <br />
        <br />
        <div class="btn btn-primary" ng-click="test()">Test</div>
        <br />
        <br />
        <table id="grid-basic" class="table table-condensed table-hover table-striped">
            <thead>
                <tr>
                    <th data-column-id="id" data-type="numeric">id</th>
                    <th data-column-id="sender">e-mail</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>1</td>
                    <td>xxx@yyy.com</td>
                </tr>
                <tr>
                    <td>2</td>
                    <td>www@yyy.com</td>
                </tr>
                <tr>
                    <td>3</td>
                    <td>zzz@yyy.com</td>
                </tr>
            </tbody>
        </table>
    </body>
</html>

jquery-bootgrid

javascript

jquery

angularjs

回答

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/47575406

复制

相似问题

问AngularJS可以与jQuery bootgrid一起使用吗？
EN

回答

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问AngularJS可以与jQuery bootgrid一起使用吗？EN

回答

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问AngularJS可以与jQuery bootgrid一起使用吗？
EN