Solved the issue. Solution is edited in this question. Thank you "praszyk".
我无法让 Angular Translate 与 Search Filter 一起工作。当语言为英语时,列表项可以照常用英语搜索。但是当语言是孟加拉语时,这些项目仍然可以用英语搜索,但不能用孟加拉语搜索。有什么解决办法吗?
查看
<ion-list>
<ion-item>
<label class="item item-input">
<i class="icon ion-search placeholder-icon"></i>
<input type="text" ng-model="input.filterUser" placeholder="Search">
</label>
</ion-item>
<ion-item class="item-avatar" ng-repeat="user in groups | filter:input.filterUser">
<img src="{{user.avatar}}">
<h2>{{user.name | translate}}</h2>
<p>{{user.fullname}}
{{user.email}}</p>
</ion-item>
</ion-list>
Controller
.controller('CreditCtrl', function($scope, $ionicConfig, $translate) {
$scope.input = {};
$scope.groups = [
{
index: 1,
index_start_at: 56,
name: "Bnd_Nilgiri",
surname: "Hayes",
fullname: "Grace Beatty",
email: "francis@livingston.es",
bool: false,
avatar: "img/ionic.png"
},
{
index: 2,
index_start_at: 57,
name: "Bnd_Nilachal",
surname: "Shayes",
fullname: "Srace Beatty",
email: "shuvo@livingston.es",
bool: false,
avatar: "img/ionic.png"
}
];
angular.forEach($scope.groups, function(user, index){
$translate(user.name, {user: user}).then(function(translated){
$scope.groups[index].name = translated;
});
});
})
翻译提供者
.config(function($stateProvider, $urlRouterProvider, $ionicConfigProvider, $translateProvider) {
$translateProvider.translations('en', {
Bnd_Nilgiri : 'Nilgiri Tourspot',
Bnd_Nilachal : 'Nilachal Tourspot',
Bnd_Bogalake : 'Bogalake Tourspot',
});
$translateProvider.translations('de', {
// Bandarban Tour Spots
Bnd_Nilgiri : 'নিলগিরি ট্যুর স্পট',
Bnd_Nilachal : 'নিলাচল ট্যুর স্পট',
Bnd_Bogalake : 'বগালেক ট্যুর স্পট',
});
$translateProvider.preferredLanguage('en');
最佳答案
那是因为你的| translate
过滤器在 Angular 过滤器之后应用。
唯一可能的解决方案是事先转换数组 groups
。
在将其应用于 groups
变量之前,您需要在 Controller 中使用 $translate
服务:
var en_translations = {
Bnd_Nilgiri : 'Nilgiri Tourspot',
Bnd_Nilachal : 'Nilachal Tourspot',
Bnd_Bogalake : 'Bogalake Tourspot',
}
var de_translations = {
Bnd_Nilgiri : 'নিলগিরি ট্যুর স্পট',
Bnd_Nilachal : 'নিলাচল ট্যুর স্পট',
Bnd_Bogalake : 'বগালেক ট্যুর স্পট',
};
var app = angular.module('myApp', ['pascalprecht.translate']);
app.config(['$translateProvider', function ($translateProvider) {
// add translation table
$translateProvider
.translations('en', en_translations)
.translations('de', de_translations)
.preferredLanguage('de');
}]);
app.controller('Ctrl', ['$scope', '$translate', function ($scope, $translate) {
// expose translation via `$translate` service
$scope.groups = [
{
index: 1,
index_start_at: 56,
name: "Bnd_Nilgiri",
surname: "Hayes",
fullname: "Grace Beatty",
email: "francis@livingston.es",
bool: false,
avatar: "img/ionic.png"
},
{
index: 2,
index_start_at: 57,
name: "Bnd_Nilachal",
surname: "Shayes",
fullname: "Srace Beatty",
email: "shuvo@livingston.es",
bool: false,
avatar: "img/ionic.png"
}
];
angular.forEach($scope.groups, function(user, index){
$translate(user.name, {user: user}).then(function(translated){
$scope.groups[index].name = translated;
});
});
}]);
我没有测试代码,但这是我想象的滚动方式。
基本上 filter:input.filterUser
对尚未翻译的 $scope.groups
数组进行操作,因此您需要在 ng-repeat
之前翻译它> 发生。
编辑:我在这里做了一个 plunkr 来展示上面的代码: http://plnkr.co/edit/sVgUIlFxfs6pDsdR2ydQ
关于javascript - ionic : How to make Angular Translate js working with Search Filter when language changed?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32816336/