Question

编辑：显示我的代码的jsfiddle。

我试图在我的JSON中保留换行符，以便它们显示在HTML中。我还尝试从查询中过滤生成的数组，以仅显示第一个结果。我不知道如何保存＆＃39;过滤后的结果，然后将其显示为HTML，以便正确显示。

<body ng-controller="TextPieces">
<div class="container-fluid">
<div class="row-fluid">
  <div class="span2">
    <!--Sidebar content-->

    <input ng-model="query">

  </div>
  <div class="span10">
    <!--Body content-->

    <ul class="tags">
      <div ng-if=query.length != 0>
        <h1>{{(lines|filter:query)[0].content}}</h1>

我试过

<p ng-bind-html-unsafe="(lines|filter:query)[0].content" />

但这没有用。

这是控制器JSON：

var snippet = angular.module（＆＃39; snippet＆＃39;，[]）;

snippet.controller('TextPieces', function ($scope) {
$scope.lines = [
  {'title': 'Aesop',
   'content': 'The earliest Greek sources <br />, including Aristotle, indicate that Aesop was born in Thrace at a site on the Black Sea coast. <br />The poet Callimachus called him Aesop of Sardis and the later writer Maximus of Tyre called him the sage of Lydia.'},
  {'title': 'Bread and Circuses',
   'content': 'This phrase originates... (etc.)

Answer 1

我使用你的JSFiddle来制作一个Plnkr.co因为我认为你还需要加载angular-sanitize.js来解决中断问题

http://plnkr.co/edit/hL5kBXRfod0a0EEzqZUg

HTML

<!DOCTYPE html>
<html ng-app="snippet">
    <head>
      <script src="http://code.angularjs.org/1.2.9/angular.js"></script>
      <script src="http://code.angularjs.org/1.2.9/angular-sanitize.js"></script>
      <script src="script.js"></script>
    </head>
    <input ng-model="query">
    <body ng-controller="TextPieces">
      <div ng-if=query.length != 0>
        <ul>    
          <li ng-bind-html="(lines|filter:query)[0].content"></li>
        </ul>
      </div>
    </body>

</html>

JS

var snippet = angular.module('snippet', ["ngSanitize"]);

snippet.controller('TextPieces', function ($scope) {
  $scope.lines = [
    {'title': 'Breakfast',
     'content': 'The earliest Greek sources, including Aristotle, indicate that Aesop was born around 620 BCE in Thrace at a site on the Black Sea coast which would later become the city Mesembria. A number of later writers from the Roman imperial period (including Phaedrus, who adapted the fables into Latin) say that he was born in Phrygia.[2] <br />The 3rd-century poet Callimachus called him Aesop of Sardis,[3] and the later writer Maximus of Tyre called him the sage of Lydia.'},
    {'title': 'Bread and Circuses',
     'content': 'This phrase originates from Rome in Satire X of the Roman satirist and poet Juvenal (circa A.D. 100). In context, the Latin metaphor panem et circenses (bread and circuses) identifies the only remaining cares of a new Roman populace which cares not for its historical birthright of political involvement. Here Juvenal displays his contempt for the declining heroism of his contemporary Romans.[5] Roman politicians devised a plan in 140 B.C. to win the votes of these new citizens: giving out cheap food and entertainment would be the most effective way to rise to power.  … Already long ago, from when we sold our vote to no man, the People have abdicated our duties; for the People who once upon a time handed out military command, high civil office, legions — everything, now restrains itself and anxiously hopes for just two things: bread and circuses.'}
        ];
});

关于存储第一个元素，或许用于触发控制器中的函数的单独的键向上处理程序是正确的方法。还在考虑一下。

在Angular中，我如何获得过滤数组的第一个元素？

1 个答案: