title: Passing parameters to the route on button click
body: <p>I am new to AngularJs. I have a search box with a button which hits the route defined in the config of Angular application.</p>
  
  <pre><code>&lt;div class="search-block clearfix"&gt;
    &lt;div class="input-group"&gt;
      &lt;input type="text" placeholder="search here..."  class="form-control input-sm"&gt;
      &lt;div class="input-group-btn"&gt;
        &lt;button type="button" class="btn btn-default btn-sm" go-click="search.htm"&gt;Search&lt;/button&gt;
      &lt;/div&gt;&lt;!-- /btn-group --&gt;
    &lt;/div&gt;&lt;!-- /input-group --&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Adding the code snippet of route config:</p>
  
  <pre><code>myApp.config(function ($routeProvider){
    $routeProvider.
      .when('/search.htm',
       {
          controller:'controllers.SearchCtrl',
          templateUrl:'/partials/search/searchPage.html'
       })
      .otherwise({ redirectTo: '/' });
     ....
  </code></pre>
  
  <p>Adding the directive(go-click) code as well:</p>
  
  <pre><code>    myApp.directive( 'goClick', function ( $location ) {
        return function ( scope, element, attrs ) {
          var path;
          attrs.$observe( 'goClick', function (val) {
          path = val;
        });
         element.bind( 'click', function () {
           scope.$apply( function () {
            $location.path( path );
        });
      });
    };
  });
  </code></pre>