javascript - 如何动态访问 angularjs 指令中的属性？

Question

我有一个指令，当给定一个数组时，它使用名称作为复选框的标签为该项目列表创建复选框。

HTML

<div>
<a style="float:right; margin-bottom: 5px;" ng-click="selectNone()" href="#">Select None</a>
<a style="float:right; margin-bottom: 5px;margin-left: 10px" ng-click="selectAll()" href="#">Select All</a>

<div class="cleared"></div>

<div class="form-input form-list">
    <label ng-repeat="item in valuelist | orderBy:'Name'">
        <input type="checkbox" checklist-model="model" checklist-value="item" /> {{item.Name}}<br />
    </label>
</div>

JS

    'use strict';

growllApp.directive('checkboxlist', [function () {
    return {
        restrict: 'E',
        templateUrl: 'scripts/modules/checkboxlist.template.html',
        controller: 'checkboxlistController',
        scope: {
            model: "=",
            value: "=",
            valuelist: "="
        }
    }
}]);

growllApp.controller('checkboxlistController', ['$scope', '$routeParams', '$location', '$cookieStore', function ($scope, $routeParams, $location, $cookieStore) {
    $scope.selectAll = function () {
        $scope.model = angular.copy($scope.valuelist);
    };

    $scope.selectNone = function () {
        $scope.model = [];
    };
}]);

使用指令

<checkboxlist ng-show="applyToProducts" model="coupon.Products" value="Name" valuelist="productsList"></checkboxlist>

所有这些在大多数情况下都可以正常工作。但是，我有一个场景，我传入的数组中有对象没有属性“名称”，而是具有属性“标题”。

我如何为确定标签的部分使用指令中名为“值”的属性。

所以在指令 html 中而不是说 {{item.Name}} 我如何通过传入属性名称在某些情况下是 title 来指定 {{item.Title}}？

Answer 1

您可以将指令的“值”属性更改为“@”(这意味着该值将作为字符串发送到您的指令。您可以在此 article 中阅读更多信息)

scope: {
        model: "=",
        value: "@",
        valuelist: "="
    }

要获取对象的属性，您可以:

  {{item[value]}}