isotope.js - 在 Angular 渲染 DOM 后初始化答案

【问题标题】：isotope.js - initialize after Angular rendered DOMisotope.js - 在 Angular 渲染 DOM 后初始化
【发布时间】：2016-06-21 00:51:51
【问题描述】：

嗯，这让这个有棱有角的新手有些白发：

我的常规同位素外部 javascript 初始化正常开始：

$(document).ready(function() {

// ISOTOPE INITIALISATON AND STUFF HERE

这一切都很好，没有角度。现在，由于我的同位素项目位于单独的投资组合.html 页面中，该页面加载到包含 ng-view div 的主 index.html 页面中，因此同位素有时无法初始化。

大约五十五十：如果我刷新同位素工作，那么它不会。所以这是因为 Angular 还没有准备好渲染 DOM。因此，即使我正在等待文档准备好（并尝试加载文档），这也不起作用。

有没有一种简单的方法可以在我的 index.html 页面加载我的投资组合.html 页面（我的投资组合包含我的同位素 div）之后使用 Angular 创建我的同位素？

请注意，我没有使用角同位素，而只是使用常规的metafizzy同位素和角。

一个尽可能简单的解决方案会很棒：在 Angular 完成之后，我必须以某种方式创建我的同位素。但是如何从我的 Script.js 文件（这是我的 Angular 脚本的文件）调用我的 main.js 文件（这是我初始化同位素的文件）中的方法

如果有任何帮助，这是我的 Angular 脚本：

// script.js

// create the module and name it scotchApp
    // also include ngRoute for all our routing needs
var scotchApp = angular.module('scotchApp', ['ngRoute']);

// configure our routes
scotchApp.config(function($routeProvider) {
    $routeProvider

        // route for the home page
        .when('/', {
            templateUrl : 'pages/home.html',
            controller  : 'mainController'
        })

        // route for the about page
        .when('/about', {
            templateUrl : 'pages/about.html',
            controller  : 'aboutController'
        })

        // route for the contact page
        .when('/contact', {
            templateUrl : 'pages/contact.html',
            controller  : 'contactController'
        });
});


// create the controller and inject Angular's $scope
scotchApp.controller('mainController', function($scope) {
    // create a message to display in our view
    $scope.message = 'Everyone come and see how good I look!';
});

scotchApp.controller('aboutController', function($scope) {
    $scope.message = 'Look! I am an about page.';
});

scotchApp.controller('contactController', function($scope) {
    $scope.message = 'Contact us! JK. This is just a demo.';
});

嗯嗯嗯嗯嗯。我想是时候喝杯茶了。唔。嗯

期待您的回复！

【问题讨论】：

标签： angularjs load jquery-isotope

【解决方案1】：

我自己解决了。

我只是将这一行添加到我的同位素 javascript 文件中

$(window).load(function() { window.setTimeout(onRenderReadyStartIsotope, 0) });

以及具有该超时函数调用的初始化同位素。这次我不需要查看指令或更改角度，DOM 现在呈现，同位素开始。

【讨论】：