A function like: ng-click="alert('Clicked')"

Question

For a mockup I need a simple mechanism like

ng-click="alert('Clicked')"

but the code above is not working, can someone help me? I don't want to touch the Controller..

Aileneaileron

this isn't how ng-click works. however, if all you need is a simple javascript alert, why are you using ng-click instead of onclick? – Correspond

we want to show an angular mockup, that's the only reason. I've added a controller function but I let the question here, maybe one day angular team would implement such of simple possibilities via ng-click.. – Aileneaileron

Answer 1

As far as I know, ng-click works only within your $scope. So you would only be able to call functions, defined in your $scope itself. To use alert, you may try accessing the window element, just by using window.alert('Clicked').

EIDT: Thanks to Ibrahim. I forgot. You shouldn't be able to use window.alert, as far as you won't define:

$scope.alert = window.alert;

In this case, using alert('Clicked') in your ng-clicked directive should work. But at the end, this method would not solve your problem of not touching your controller.

Martelli

it wont work either, because angular will look for "$scope.window.alert" function, you can write a simple directive for that need which takes string and alerts it. – Smolder

of course if you mean ng-click="window.alert('clicked')", if you mean to write function in scope, then you do not necesarilly use window.alert, just alert will work too. – Smolder

ok, if I need the scope, I use direct href="javascript:... :/ – Aileneaileron

Thank you both, but: I need a solution without touching the Controller's $scope. – Aileneaileron

Answer 2

Refer to previous answer, ng-click = "alert('Hello World!')" will work only if $scope points to window.alert i.e

$scope.alert = window.alert;

But even it creates eval problem so correct syntax must be:

HTML

<div ng-click = "alert('Hello World!')">Click me</div>

Controller

$scope.alert = function(arg){
    alert(arg);
}

Abet

The accepted answer didn't work for me, but this one did – Utilitarianism

@Joe,@Neeraj, where you putting the definition ? "Controller" you mean inside .ts file ? – Hawsepiece

Answer 3

You can use

onclick="alert('Clicked')"

for debugging purposes

Gleesome

Answer 4

As Neeraj mentioned, the accepted answer does not work. Add something like this to your controller to avoid an Illegal Invocation error:

$scope.alert = alert.bind(window);

Xeroderma

I have to use this instead of the accepted answer while I am using Ionic 1.3 which is dependent on AngularJS 1.5 – Milson