Question

我有一个flashcard应用程序，我从服务器获取一组闪卡记录，然后在ng-repeat循环中运行它。但是，我不想循环遍历这些平面记录，而是想用我可以调用的方法遍历一组对象，就像我在PHP中一样。

是否有“AngularJS”方法可以做到这一点，如果没有，最好的方法是什么，以便我能够做到这一点。使用我的记录加载一个flashcard对象的集合，然后使用ng-repeat？

在多个视图中使用此集合

控制器：

mainApp.controller('browseController', function ($scope, $http, $rootScope) {
    $http.get($rootScope.dataUrlPath, {
        params: {
            taskIdCode: 'getAllFlashcardsWithStacks'
        }
    }).success(function (data) {
        $scope.flashcards = data['flashcards'];
    });
});

查看：

<div class="col-md-5">
    <h1 class="pageTitle">Browse Flashcards</h1>
    <div ng-repeat="flashcard in flashcards">
        <div>{{flashcard.front}}</div>
        <div>{{flashcard.back}}</div>
    </div>
</div>

我想做的是这样的事情：

<div class="col-md-5">
    <h1 class="pageTitle">Browse Flashcards</h1>
    <div ng-repeat="flashcard in flashcards">
        {{flashcard.displayAsRichInteractiveFlashcard()}}
    </div>
</div>

但是如果可能的话，我想做“Angular方式”，这似乎远离Angular的工作方式。

将记录转换为富对象集合的最佳方法是什么，以便我可以从各种视图访问其丰富的方法？

Answer 1

是，有一种角度方式可以访问ng-repeat中的数据，即闪卡，使用可以调用的方法：通过创建自定义指令。

我们称之为自定义指令 my-flashcard-directive 。

<强>标记

<div ng-repeat="flashcard in flashcards">
    <my-flashcard-directive flashcard="flashcard"></my-flashcard-directive>
</div>

然后在 my-flashcard-directive

中定义您的方法

您的指令可以访问scope.flashcard并可以随意对其进行操作。

<强>指令

myModule.directive('myFlashcardDirective', function() {
    return {
        scope: {
            flashcard: '='
        },
        restrict:'E',
        template:"<div>{{flashcard.displayAsRichInteractiveFlashcard() }}</div>",
        link: function(scope, element, attrs) {
scope.flashcard.displayAsRichInteractiveFlashcard=function (){//whatever
       };
        }
    }
});

您的集合仍然具有相同的json-transportable字符串属性。

但是，您的自定义指令现在可以根据需要对其进行扩充。

将平面记录转换为对象的最佳方法是什么？

1 个答案: