AngularJS Call custom object function with ng-click

Question

I am new to AngularJS and I am still being a bit confused about calling an custom method of an object and if there is a more lazy way to do it:

https://jsfiddle.net/f4ew9csr/3/

<div ng-app="myApp" ng-controller="myCtrl as myCtrl">
    <h1 ng-click="myCtrl.display()">Click me!</h1>
    <h2>{{ myCtrl.myValue }}</h2>
</div>

var app = angular.module('myApp', []);
app.controller('myCtrl', function() {
    var self = this;
    this.myValue = "Hello world!"
    this.display = function() {
        self.myValue = MyObject.display();
    };
});

var MyObject = new function() {

    var i = 0;

    this.display = function() {
        alert("Change h2");
        return "Hey";
    };

    this.update = function() {
        i += 1;
        return i;
    }
};

So when the h1 is clicked the h2 gets changed and an alert pops up. But my question is that I want to call a custom object method with ng-click in a more efficient way than I am doing right know. And how could I run MyObject.update() with setInterval so it constantly changes my h2 header without jquery?

Pankaj Parkar · Accepted Answer · 2015-07-09 22:20:14Z

1

I'd suggest you to use $interval in your case which will call the function on specified amount of time interval

Markup

<div ng-app="myApp" ng-controller="myCtrl as myCtrl">
     <h1 ng-click="myCtrl.display()">Click me!</h1>
     <h2>{{ myCtrl.myValue +' Count'+ myCtrl.count}}</h2>
</div>

Code

$interval(function () {
    self.count = MyObject.update();
}, 1000)

Working Fiddle

answered Jul 9, 2015 at 22:20

Pankaj Parkar

136k23 gold badges241 silver badges307 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Greeneco Over a year ago

Thx for your quick answer, so with angularjs I have to outsource some stuff to the app.controller function? in contrast when using jquery where I can handle everything inside my object, like changing some html?

Pankaj Parkar Over a year ago

@user3852496 which object you are talking about..could you explain me more..?

Collectives™ on Stack Overflow

AngularJS Call custom object function with ng-click

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related