페이지 내용이로드 된 후 호출하려는 기능이 있습니다. $ viewContentLoaded에 대해 읽었으며 작동하지 않습니다. 나는 무언가를 찾고있다.
document.addEventListener('DOMContentLoaded', function () {
//Content goes here
}, false);
AngularJs 컨트롤러에서는 위의 호출이 작동하지 않습니다.
답변
$ viewContentLoaded의 문서에 따르면 작동해야합니다.
ngView 컨텐츠를 다시로드 할 때마다 발생합니다.
$viewContentLoaded
이 이벤트를 수신한다는 의미의 이벤트가 발생합니다.
<div ng-controller="MainCtrl">
<div ng-view></div>
</div>
에서 MainCtrl
이 이벤트를들을 수 있습니다
$scope.$on('$viewContentLoaded', function(){
//Here your view content is fully loaded !!
});
데모 확인
답변
각도 <1.6.X
angular.element(document).ready(function () {
console.log('page loading completed');
});
각도> = 1.6.X
angular.element(function () {
console.log('page loading completed');
});
답변
고정-2015.06.09
지시문과 각도 요소 ready
방법을 다음과 같이 사용하십시오 .
js
.directive( 'elemReady', function( $parse ) {
return {
restrict: 'A',
link: function( $scope, elem, attrs ) {
elem.ready(function(){
$scope.$apply(function(){
var func = $parse(attrs.elemReady);
func($scope);
})
})
}
}
})
html
<div elem-ready="someMethod()"></div>
또는 컨트롤러로 구문을 사용 하는 사람들을 위해 …
<div elem-ready="vm.someMethod()"></div>
이것의 장점은 원하는만큼 UI를 넓게 또는 세분화 할 수 있고 컨트롤러에서 DOM 로직을 제거한다는 것입니다. 이것이 권장되는 Angular 방식 이라고 주장합니다 .
동일한 노드에서 다른 지시문이 작동하는 경우이 지시문의 우선 순위를 지정해야 할 수도 있습니다.
답변
{{YourFunction()}}
HTML 요소 다음 에 추가하여 직접 호출 할 수 있습니다 .
여기 Plunker Link
있습니다.
답변
Google 차트를 처리하는 동안이 논리를 구현해야했습니다. 내가 한 것은 컨트롤러 정의 내부의 HTML 끝에서 추가 한 것입니다.
<body>
-- some html here --
--and at the end or where ever you want --
<div ng-init="FunCall()"></div>
</body>
그 기능에서 단순히 논리를 호출하십시오.
$scope.FunCall = function () {
alert("Called");
}
답변
var myM = angular.module('data-module');
myM.directive('myDirect',['$document', function( $document ){
function link( scope , element , attrs ){
element.ready( function(){
} );
scope.$on( '$viewContentLoaded' , function(){
console.log(" ===> Called on View Load ") ;
} );
}
return {
link: link
};
}] );
위의 방법은 나를 위해 일했습니다.
답변
각도 js에서 onload 이벤트의 자바 스크립트 버전을 호출 할 수 있습니다. 이 ng-load 이벤트는 div, span, body, iframe, img 등과 같은 dom 요소에 적용될 수 있습니다. 다음은 기존 프로젝트에 ng-load를 추가하는 링크입니다.
다음은 iframe에 대한 예제입니다. 일단로드 되면 testCallbackFunction 이 컨트롤러에서 호출됩니다.
예
JS
// include the `ngLoad` module
var app = angular.module('myApp', ['ngLoad']);
app.controller('myCtrl', function($scope) {
$scope.testCallbackFunction = function() {
//TODO : Things to do once Element is loaded
};
});
HTML
<div ng-app='myApp' ng-controller='myCtrl'>
<iframe src="test.html" ng-load callback="testCallbackFunction()">
</div>