Edit in JSFiddle

var app = angular.module('app', []).config(function($compileProvider) {

      //blobで始まるurlを許可する
    $compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|blob):/);
});

app.controller('MyController', function($scope) {
    $scope.people = [
        'atsumo'
    ];
    
    $scope.addPerson = function(name) {
      $scope.people.push(name);  
    };
    
    $scope.createData = function() {
        //json形式のデータを作る
        var blob = new Blob([ JSON.stringify($scope.people) ], { "type" : "application/json" });
        window.URL = window.URL || window.webkitURL;

        $scope.url = window.URL.createObjectURL(blob);
    };
});

<div ng-app="app">
    <div ng-controller="MyController">
        <h1>リスト</h1>
        <form>
            <input ng-model="name" preholder="検索" />
            <button ng-click="addPerson(name)">追加</button>
        </form>
        <a ng-click="createData()" ng-href="{{url}}" download="sample.json">download</a>
        <div>
            {{ people | json }}
        </div>
    </div>
</div>

</style> <!-- Ugly Hack to make remote files preload in jsFiddle --> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.9/angular.min.js"></script>
<style>