How to trigger ng-click [AngularJS] on Page load from Code behind

Question

I am generating a label tag dynamically from code behind which has property of ng-click, this is linked to a function in controller that is in a separate js file. I want to automatically trigger this ng-click event when the page is loaded. I have tried the below with no luck,

Page.ClientScript.RegisterStartupScript(Master.GetType(), f, "document.getElementById('Element').click();", True)

Page.ClientScript.RegisterStartupScript(Master.GetType(), f, "document.getElementById('Element').triggerHandler('click');", True)

Page.ClientScript.RegisterStartupScript(Master.GetType(), f, "document.getElementById('Element').trigger('click');", True)

I'd fire a $broadcast at a custom listener, if possible... I have a feeling you're trying to short circuit to "fire" the click event. I've done something like firing $rootScope.$broadcast('contactInfoUpdated', null); once the page loads (you could register it). Then have a function in the controller function, it would have an event handler like: $scope.$on('contactInfoUpdated', function (event) { // do your event here }); — Thomas Taylor, Mar 03 '15 at 21:21
Why wouldn't you just pass data to page and react to that data? Far simpler to test. — charlietfl, Mar 03 '15 at 23:44

score 0 · Answer 1 · answered Mar 03 '15 at 21:46

You need to trigger a digest cycle in order for the ng-click to be processed.

Check out this answer from the most appropriate person to answer anything angular :D

Call Angular JS from legacy code

Also checkout this related fiddle http://jsfiddle.net/peterdrinnan/2nPnB/16/

function externalCall(){
    angular.element($("#microController-div")).scope().incrementDataInService();
}

function baseController($scope, myService) {
    $scope.x = 1;
    $scope.incrementDataInService= function() {

        myService.increase();
        // if you are calling from legacy code, you will need to invoke $apply()
        $scope.$apply();
    }     
    $scope.$on('XChanged', function(event, x) {
        $scope.x = x;
    });        
}

How to trigger ng-click [AngularJS] on Page load from Code behind

1 Answers1