Я пытаюсь встроить временную шкалу, используя директиву Angular, которая загружает данные из сгенерированного php файла JSON (timeline.json.php).
var app = angular.module("timeline", []);
app.controller('timelineCtrl', ['$scope', '$http',
function ($scope, $http) {
$http.get('timeline.json.php').success(function(data) {
$scope.results = data;
console.log($scope.results);
});
}]);
app.directive('timelineJs', function ($timeout) {
return {
restrict: 'A',
link: function (scope, elem, attrs) {
postpone = $timeout(function() {
createStoryJS({
width: '100%',
hash_bookmark: true,
height: '600',
source: scope.results,
embed_id: 'my-timeline',
css: 'http://cdn.knightlab.com/libs/timeline/latest/css/timeline.css',
js: 'http://cdn.knightlab.com/libs/timeline/latest/js/timeline-min.js'
});
}, 0);
}
}
});
Временная шкала не загружает файл PHP, даже если он работает при загрузке его без плагина или вводе его непосредственно в качестве источника (вместо «scope.results»). Я также могу загрузить нормальный файл JSON без проблем, и мой сгенерированный JSON отлично проверяет.
Мне нужно иметь возможность использовать файл json.php. Благодарю.
Посмотрите, поможет ли это ввести $rootScope
оказание услуг.
app.directive('timelineJs', function ($timeout, $rootScope) {//inject $rootScope
return {
restrict: 'A',
link: function (scope, elem, attrs) {
postpone = $timeout(function() {
createStoryJS({
width: '100%',
hash_bookmark: true,
height: '600',
source: scope.results,
embed_id: 'my-timeline',
css: 'http://cdn.knightlab.com/libs/timeline/latest/css/timeline.css',
js: 'http://cdn.knightlab.com/libs/timeline/latest/js/timeline-min.js'
});
}, 0);
}
}
});
Если вы используете AngularJs с TimelineJs, то я предлагаю вам пойти и кодировать с Angular кодом, не используя createStoryJS
, Пожалуйста, посмотрите на Угловой-timelinejs
На самом деле вариант, предложенный @Mikey, тоже может сработать (просто вам это не нужно postpone
оберните createStoryJS
с $timeout
чтобы DOM отображал элементы первым)