AngularJS:初始化ZURB Foundation JS

Question

我正在使用AngularJS和Foundation.

要初始化Foundation JS,您必须进行以下调用:

$(document).foundation();

在AngularJS应用程序中进行此调用的最佳方法是什么？代码示例将不胜感激.

另外,如果我要编写一个围绕Foundation JS组件的指令,我怎么能确保Foundation被初始化？

Answer 1

以下是我的观点app.js:

.run(function($rootScope) {
    $rootScope.$on('$viewContentLoaded', function () {
        $(document).foundation();
    });
});

这将在加载新视图时重新初始化Foundation(以便初始化新视图中包含的组件).这样,您的控制器无需了解这一点.

Answer 2

您可以$apply使用代码将其引入Angular框架.下面是一个使用$rootScopewith 的示例run,这也可以在一个控制器/指令中使用any来完成$scope:

app.run(function($rootScope){
    $rootScope.$apply($(document).foundation());
});

另外一个选项::

$compile($(document).foundation())($scope);

请务必$compile在控制器/指令中包含该服务以便以这种方式使用它.例如:

app.directive('mydirective', function($compile) {
    return {
        link: function(scope, element, attrs) {
            $compile($(document).foundation())(scope);
        }
    }
});