AngularJS: Location

change url

by dshilkret

HTML

<div ng-controller="MyCtrl">

    <a href="#!/test/?target=Bob">Bob</a>
    <a href="#!/test/?target=Paul">Paul</a>
    
    <hr/>    
    URL 'target' param getter: {{target}}<br>
    Full url: {{location.absUrl()}}
    <hr/>
    
    <button ng-click="changeTarget('Pawel')">target=Pawel</button>
    
</div><div ng-app>
    <div ng-controller="MyCtrl">
        <input type="text" ng-model="target" ng-change="update2()">
        <input type="text" ng-model="search">
        <table>
            <tbody>
                <tr ng-repeat="item in items">
                    <td>{{item.id}}</td>
                    <td>{{item.name}}</td>
                </tr>
            </tbody>
        </table>
    </div>
</div>

JavaScript

var myApp = angular.module('myApp', []);

function MyCtrl($scope, $location, $filter) {

    $scope.location = $location;
    $scope.$watch('location.search()', function() {
        $scope.target = ($location.search()).target;
    }, true);

    $scope.changeTarget = function(name) {
        $location.search('target', name);
    }
     $scope.items = [
        {id:1, name:'John'},
        {id:2, name:'Steve'},
        {id:3, name:'Joey'},
        {id:4, name:'Mary'},
        {id:5, name:'Pawell'},
        {id:6, name:'Bob'},
        {id:7, name:'Paul'},
        {id:8, name:'Pawell'},
        {id:9, name:'Marylin'}];
    
    $scope.items2 = $scope.items;
   
     $scope.$watch('target', function(val)
    { 
    $scope.items = $filter('filter')              ($scope.items2, val);
    });
    $scope.update2 = function(){
    $scope.target = $scope.search;
}
}