Menu
Suppose you are using routes:
// bootstrap myApp.config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider) { $routeProvider.when('/home', { templateUrl: 'partials/home.html', controller: 'HomeCtrl' }); $routeProvider.when('/about', { templateUrl: 'partials/about.html', controller: 'AboutCtrl' }); ... And in your html, you want to navigate to the about page when a button is clicked. One way would be
<a href="#/about"> ... but it seems ng-click would be useful here too.
<div ng-click="/about">
915
The ng-click directive tells AngularJS what to do when an HTML element is clicked.
Another significant difference between ng-click and onclick is the execution context. Code inside an onclick attribute executes against the global window object, while an expression inside of ng-click executes against a specific scope object, typically the scope object representing the model for the current controller.
When an HTML is clicked, the ng-click directive tells the AngularJS script what to do. In this article, we will learn how to get many/multiple functions to the ng-click directive passed, in just one click. The key is to add a semi-colon (;) or a comma (,). All the functions must be separated by a (;) or a (, ).
For a single btn, it's ok to use ng-click or onclick in the ng-app . There is no difference between the two functions. For effective team work, you,d better to have an account with each other. In Angular apps, ng-click is recommended.
Introduction to AngularJs onclick AngularJS ng-click is an In-Built AngularJS directive that is mainly used to handle the click events on the HTML view and processing the data in the controller as per requirements. The ng-click directive can be used with multiple HTML elements such as button, input, select, checkbox, etc.
Remember that if you use ng-click for routing you will not be able to right-click the element and choose 'open in new tab' or ctrl clicking the link. I try to use ng-href when in comes to navigation. ng-click is better to use on buttons for operations or visual effects like collapse. But About I would not recommend.
You can simply prevent the default behavior of the click event directly in your template. Directives like ngClick and ngFocus expose a $event object within the scope of that expression. This is a great solution. If you have an href, you can right click to open it in a new tab, but on left click it calls ng-click. Exactly what I was looking for
The expression inside an ng-click directive can be a function call where function declaration is in the controller; expression can also be directly written in the HTML view and evaluated there itself. It is a good practice to write the complex logic inside a function defined in the controller and then invoke the HTML view function.
Routes monitor the $location service and respond to changes in URL (typically through the hash). To "activate" a route, you simply change the URL. The easiest way to do that is with anchor tags.
<a href="#/home">Go Home</a> <a href="#/about">Go to About</a> Nothing more complicated is needed. If, however, you must do this from code, the proper way is by using the $location service:
$scope.go = function ( path ) { $location.path( path ); }; Which, for example, a button could trigger:
<button ng-click="go('/home')"></button> If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
