how to redirect one html page to another using button click event in angularjs

Question

i am using angularjs directive to redirect another html page.i am writing click function inside directive but i am getting page name in alert box not redirect to another html page.

sample.html:

<test1>
<button data-ng-click="click('/page.html')">Click</button>
</test1>

sample.js:

app.directive('test1',['$location', function(location) {
    function compile(scope, element, attributes,$location) {
         return{
             post:function(scope, element, iAttrs,$location) {
                 scope.click=function(path)
                 { 
                     alert("click"+path);
                     $location.path('/path');
                 };
             }
         };
        }

        return({
            compile: compile,
            restrict: 'AE',
        });

    }]);

i want to redirect page.html how to do this please suggest me. Thanks.

Answer 1

In html,

<button ng-click="redirect()">Click</button>

In JS,

$scope.redirect = function(){
  window.location = "#/page.html";
}

Hope it helps.....

Answer 2

Would probably make a small modification.

inject $location and use:

$scope.redirect = function(){
  $location.url('/page.html');
}

The benefits of using $location over window.location can be found in the docs, but here's a summary as of (1.4.x)

https://docs.angularjs.org/guide/$location

If anyone knows how to make this redirect directly from the html in a cleaner way please let me know because I would prefer that sometimes over making a function in the controller...