AngularJS – 如何使用变量呈现局部变量？

发布时间：2020-12-17 08:10:27 所属栏目：安全来源：网络整理

导读：例如，我在car-list.html中有一个部分，我想在几个不同的汽车集合的地方呈现它。也许这样的事情： h1All New Cars/h1div ng-include="car-list.html" ng-data-cars="allCars | onlyNew"/divh1All Toyotas/h1div ng-include="car-list.html" ng-data-cars="al

例如，我在car-list.html中有一个部分，我想在几个不同的汽车集合的地方呈现它。也许这样的事情：

<h1>All New Cars</h1>
<div ng-include="car-list.html" ng-data-cars="allCars | onlyNew"></div>

<h1>All Toyotas</h1>
<div ng-include="car-list.html" ng-data-cars="allCars | make:toyota"></div>

与正常情况的主要区别是，部分人不需要知道任何关于其显示的汽车列表。它给了一系列的汽车，并显示它们。可能如：

<!-- car-list.html -->
<div ng-repeat="car in cars" ng-controller="CarListControl">
    {{car.year}} {{car.make}} {{car.model}}
</div>

您可以使用指令轻松实现。

这样的事情

angular.module('myModule')
.directive('cars',function () {
  return {
    restrict: 'E',scope: { 'cars': '=data' },template: "<div ng-repeat='car in cars'>n" +
    "  {{car.year}} {{car.make}} {{car.model}}n" +
    "</div>"
  };
});

那么你可以这样使用它：

<h1>All New Cars</h1>
<cars data="allCars | onlyNew"></cars>

<h1>All Toyotas</h1>
<cars data="allCars | make:toyota"></cars>

您可以找到有关指令here的更多信息。

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!