Javascript TimelineJs和AngularJs查看内容
我在我的项目中使用AngularJs,所以我的应用程序中的所有主要内容都是使用angular的ng view指令加载的,我想在我的应用程序中使用TimelineJs实现一个时间线,时间线的id(放置时间线的位置)但是我的具有该id的div是通过angular异步加载的,所以当TimelineJs脚本运行div#id时,您知道如何解决这个问题吗 代码如下:Javascript TimelineJs和AngularJs查看内容,javascript,jquery,angularjs,timeline.js,Javascript,Jquery,Angularjs,Timeline.js,我在我的项目中使用AngularJs,所以我的应用程序中的所有主要内容都是使用angular的ng view指令加载的,我想在我的应用程序中使用TimelineJs实现一个时间线,时间线的id(放置时间线的位置)但是我的具有该id的div是通过angular异步加载的,所以当TimelineJs脚本运行div#id时,您知道如何解决这个问题吗 代码如下: $(document).ready(function() { createStoryJS({ type:
$(document).ready(function() {
createStoryJS({
type: 'timeline',
width: '800',
height: '400',
source: './timeline.json',
embed_id: 'dash-tim'
});
});
下面是错误:
Uncaught TypeError: Cannot call method 'appendChild' of null storyjs-embed.js:45
T storyjs-embed.js:45
createStoryJS storyjs-embed.js:45
(anonymous function) extra.js:21
fire jquery-1.8.2.js:974
self.fireWith jquery-1.8.2.js:1082
jQuery.extend.ready jquery-1.8.2.js:406
DOMContentLoaded
下面是我如何实现它的 我有一个angular指令,它调用timelineJS代码来修改dom(我不是longshot的angularjs专家,但这似乎是其他人推荐的模式) HTML
<div ng-app="StoryUniverse" ng-controller="EventsListCtrl">
<div id="my-timeline" timeline-js></div>
</div>
app.directive('timelineJs', function ($timeout) {
return {
restrict: 'A',
link: function (scope, elem, attrs) {
postpone = $timeout(function() {
createStoryJS({
type: 'timeline',
width: '800',
height: '600',
source: scope.events,
embed_id: 'my-timeline',
css: 'lib/timelinejs/css/timeline.css',
js: 'lib/timelinejs/js/timeline.js'
});
}, 0);
console.log("Running timelineJS");
}
}
});