使用AngularJS仅用于路由目的

Use AngularJS just for routing purposes

本文关键字：路由 用于 AngularJS 使用      更新时间：2024-03-27

我刚刚被分配了一个完全用jQuery制作的网站。它异步加载几个页面，并希望成为SPA。

现在唯一的问题是，开发人员一般没有考虑URL，人们除了通过www.example.com 之外，其他任何方式都无法访问该网站

我对AngularJS有点了解，我的问题是：-是否值得集成AngularJS来管理路由，这样我就不必通过jQuery检查每一次点击，然后再检查每一个链接？

感谢

当然，您可以使用AngularJs进行路由。

如果angular和jquery停止协同工作，则不能对angular指令中生成的视图使用jquery选择，因为jquery不会选择运行时生成的视图。

要监视angularjs何时完成DOM操作，请在angular的控制器中使用它来调用jqueryStartWork方法，该方法应启动jquery的工作。

function stuffController($scope) {
$scope.$on('$viewContentLoaded', jqueryStartWork);
}

对于渲染监视器的一些angularjs指令，您可以有一个指令，当angular通过该指令完成dom操作时，该指令将触发事件。例如，为了监控ng重复，为渲染完成添加此指令

var app = angular.module('myapp', [])
.directive('onFinishRender', function ($timeout) {
return {
    restrict: 'A',
    link: function (scope, element, attr) {
        if (scope.$last === true) {
            $timeout(function () {
                scope.$emit('ngRepeatFinished');
            });
        }
    }
}
});

然后在控制器中添加一个新函数，该函数将在ng重复完成时调用，如下所示。

$scope.$on('ngRepeatFinished', function (ngRepeatFinishedEvent) {
    //you also get the actual event object
    //do stuff, execute functions -- whatever...
    alert("ng-repeat finished");
});

但是不要忘记将这个指令添加到你的ng重复标签中，就像这个一样

<tr data-ng-repeat="product in products" on-finish-render>

[EDIT]今天，我一直在尝试在md选项卡的div中运行一个简单的D3svg-append脚本。我遇到了在控制器完成（md选项卡也完成）渲染所有内容后绘制它的问题。我发现，如果您使用$timeout（windows.setTimeout上的包装器），它将向浏览器的事件队列添加一个新事件。它将在当前队列（呈现）之后和您按顺序添加的新超时事件函数之前运行。它也适用于0ms。

 $timeout(drawTree, 0); //drawTree is a function to get #tree div in a md-tab and append a D3 svg
相关文章：