filter by $key in ngRepeat - angularjs

Question

I am trying to manipulate HTML5's audio element on an Angular backend.
(not a developer myself)
Using Angular-filter or any workaround to $key,
I would like to search by word.$key and not by the property 'value'.
var app = angular.module("app", ['angular.filter']);
app.controller("myCtrl", function($scope) {
$scope.words = {
'art': [{
'value': 'art',
'lang': 'english'
}],
'lamp': [{
'value': 'lamp',
'lang': 'english'
}, {
'value': 'lámpara',
'lang': 'espanol'
}],
'window': [{
'value': 'window',
'lang': 'english'
}, {
'value': 'ventana',
'lang': 'espanol'
}],
'bicycle': [{
'value': 'bicicleta',
'lang': 'espanol'
}]
};
$scope.play = function(id) {
document.getElementById(id).play()
};
});
app.filter('trustedAudioUrl', function($sce) {
return function(path, audioFile) {
return $sce.trustAsResourceUrl(path + audioFile);
};
});
app.directive('audios', function($sce) {
return {
restrict: 'AE',
scope: {
code: '=',
extra: '='
},
replace: true,
template: '<audio id="{{code}}-{{extra}}" ng-src="{{url}}"></audio>',
link: function(scope) {
scope.$watch('extra', function(newLang, oldLang) {
scope.$watch('code', function(newVal, oldVal) {
var prefix = 'http://www.almatsuy.com/Johanna/sound/words/';
if (newVal !== undefined) {
scope.url = $sce.trustAsResourceUrl(prefix + newLang + "/" + newVal + ".mp3");
}
})
});
}
};
});
td button {
text-transform: capitalize;
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-filter/0.5.4/angular-filter.js"></script>
<div ng-app="app" ng-controller="myCtrl">
<div ng-repeat="word in words">
<audios ng-repeat="audio in word" code="word.$key" extra="audio.lang" />
</div>
<input type="text" ng-model="searchKey" placeholder="search by key" />
<table>
<tbody ng-repeat="word in words | toArray: true">
<tr ng-repeat="t1 in word | fuzzyBy: 'value': searchKey">
<th>{{word.$key}} -- {{t1.lang}}</th>
<td>
<button ng-click="play(word.$key+'-'+t1.lang)">{{t1.value}}</button>
</td>
</tr>
</tbody>
</table>
</div>

Answer 1

I believe this might be something to do with old angular version.
I tried your code in JSFiddle, and in where i used Angular in version 1.1.1 it does not work, but as soon as i change version to 1.2.1 it works fine