javascript - Angularjs:在数组上映射 Angular 过滤器-6ren

javascript - Angularjs:在数组上映射 Angular 过滤器

转载作者：行者123 更新时间：2023-11-27 23:14:14

33

4

假设我有一个 Angular 过滤器translate，它对字符串进行处理 - 不管是什么 - 以及一个过滤器sort，它按字母顺序对内容进行排序(如 orderBy : 'toString()').

我现在想从字符串数组 str 中打印出字符串，但根据它们的翻译进行排序。也就是说，我想让以下 html 代码起作用:

<div ng-repeat="s in strs | translate | sort">{{ s }}</div>

它不起作用 - 我认为这是因为 translate 是一个作用于字符串的过滤器，有点像签名 String → String。但我需要它对字符串数组起作用，对吗？有点像签名 [String] → [String]，对吧？如果这是真的，我需要找到一种方法在该 Angular 表达式中映射 translate 到数组，例如 strs。

我怎样才能做到这一点，或者以 Angular 方式优雅地实现我想要的东西？

示例。假设 translate 将字符串 'a'、'b'、'c' 发送到 'z'分别为 、'y'、'x'。然后，我希望上面的 Angular 增强 html 元素生成等效的 html 输出:

<div>c</div> <div>b</div> <div>a</div>

最佳答案

如果您的翻译库不支持数组上的翻译，我会为此目的向您的项目添加一个新的过滤器:

angular.module("mymodule", ["pascalprecht.translate"]);
angular.module("mymodule").config(function($translateProvider) {
  // Set up message keys
  $translateProvider.translations('en', {
    A: 'Apple',
    B: 'Banana'
  })
}).run(function($translate) {
  // Select language
  $translate.use("en");
})
/**
 * @filter translateArray
 * @description Convert an array of message IDs 
 * to an array of translations using the `$translate` service
 * @param {Array<String>} translationIDs - An array of message keys
 * @returns {Array<String>} - An array of translated strings.
 */
.filter("translateArray", function($translate) {
  return function(translationIDs) {
    return translationIDs.map(function(id) {
      return $translate.instant(id);
    })
  };
}).controller("demoController", function($scope) {
  // Template will translate then sort. Should give:
  // Apple, Banana
  $scope.strs = ["B", "A"];
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-translate/2.10.0/angular-translate.min.js"></script>

<body ng-app="mymodule">
  <div ng-controller="demoController">
    <div ng-repeat="s in (strs | translateArray | orderBy:'toString()')">{{s}}</div>
  </div>
</body>

关于javascript - Angularjs:在数组上映射 Angular 过滤器，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35946069/

33

4

0

文章推荐： javascript - OpenLayers 3.13v : issue with ol. 格式.GeoJSON()

文章推荐： javascript - 如何验证数字是否为整数

文章推荐： javascript - 无法调用函数/AJAX 相关

c++ - 映射/设置迭代器不是可取消引用的 C++ 映射
请看一下我的代码。 int main () { Program* allcommand = new Program; allcommand->addCommand("add", new
c++ - typedef 映射、for 循环调试断言、映射/设置不兼容
因此，当我遇到调试断言时，我正在编写代码。现在我很想知道为什么这段代码不起作用: for(Model::MeshMap::iterator it = obj1->GetMeshes().begin()
java - 组、收集器、映射(整数到字符串)、映射(映射到对象)
这是我上一个问题的延续 Group, Sum byType then get diff using Java streams . 按照建议，我应该作为单独的线程发布，而不是更新原始线程。因此，通过我
javascript - JQuery 映射 vs Javascript 映射 vs For 循环
我正在实现一些非常适合 map 的代码。但是，我要迭代的列表中有大量对象，所以我的问题是哪种方法是解决此问题的最佳方法: var stuff = $.map(listOfMyObjects, some
不同类成员函数指针的C++映射
我正在尝试创建一个包含不同类的成员函数指针的映射。成员函数都具有相同的签名。为了做到这一点，我所有的类都继承了一个 Object 类，它只有默认构造函数、虚拟析构函数和一个虚拟 ToString()
具有相同键类型和不同项目类型的c++映射
这个问题在这里已经有了答案: 关闭 11 年前。 Possible Duplicate: how do you make a heterogeneous boost::map? 有可能在 C++ 中
Mysql WHERE IN 映射
我有一个 Mysql 查询，请检查以下内容: SELECT `tbl_classSubjects`.`classID` , `tbl_classSubjects`.`sectionID` , `tbl
JNA直接与接口(interface)映射？
抱歉，这可能是一个基本问题。 JNA直接映射和接口(interface)映射有什么区别？我的解释是否正确: 直接映射 : 直接使用库对象(如 Java 中的静态 main) 接口(interface
以部分函数为值的 Scala 映射
在 Twitter's Scala school collections section ，它们显示了一个带有偏函数作为值的 Map: // timesTwo() was defined earlie
FFMPEG channel 映射
很难说出这里问的是什么。这个问题是模棱两可的、模糊的、不完整的、过于宽泛的或修辞的，无法以目前的形式得到合理的回答。如需帮助澄清这个问题以便重新打开它，visit the help center .
具有原始类型值类型的 Scala 映射
据我了解，从 scala stdlib 声明一个映射并没有将其专门用于原始类型。我要的不是付出装箱/拆箱的代价，而是同时拥有scala map 的接口(interface)。一个明显的选择是使用 tr
没有键路径的数组的 Restkit 映射
如何为这样的 JSON 响应创建对象映射，它只是一个整数数组: [ 565195, 565309, 565261, 565515, 565292, 565281, 566346, 5
NHibernate DTO 映射
是否可以为 DTO 对象创建映射然后查询它们而不是域？如果不解释为什么？如果我需要几个 dtos 怎么办？ DTos 是只读的 ID 由 NH 自动生成将来这些 dtos 将设置映射到链接的 d
包含混合类型值的 Scala 映射
我有一个返回的函数(常规代码) [words: "one two", row: 23, col: 45] 在 Scala 中，我将上面更改为 Scala Map，但随后我被迫将其声明为 Map[Str
python - 映射 - 特征重要性与标签分类
我有一组与 Vanilla 磅蛋糕烘焙相关的数据(200 行)，具有 27 个特征，如下所示。标签caketaste是衡量烤蛋糕的好坏程度，由 bad(0) 定义, neutral(1) , good
复杂连接的 Hibernate 映射
我有试图映射到新代码的遗留代码。 OLD_PERSON pid sid name age NEW_PERSON pid sid fid age RESOLVE_PERSON pid fid statu
带有鉴别器的 hibernate 映射
我有一个表，其中一个字段可以指向其他 3 个表之一中的外键，具体取决于鉴别器值是什么(Project、TimeKeep 或 CostCenter。通常这是用子类实现的，我想知道我有什么注意子类名称与
Haskell:映射 runST
我有一个类型 [ST s (Int, [Int])] 的绑定(bind)我正在尝试申请runST使用映射到每个元素，如下所示: name :: [ST s (Int, [Int])] --Of Cou
子类和连接子类的 NHibernate 映射
在我正在进行的项目中，我有以下实体:分析师、客户和承包商。每个都继承自基类 User。 public abstract class User { public virtual int Id
用户输入的 Vim 映射
我想知道是否可以在 Vim 中创建一个映射(对于普通模式)，允许用户在映射执行之前输入。我想为我最常用的 grep 命令创建一个快捷方式的映射。我希望命令允许输入我正在搜索的内容，然后在输入时执行。

首页

博学

6Ren·AI

商城

javascript - Angularjs:在数组上映射 Angular 过滤器