1

私は単純な ng-repeat を持っています

<div ng-repeat="obj in someArray"></div>

obj.type == "type1"カスタム ディレクティブ "type1" ifを使用し、カスタム ディレクティブ "type2" ifを使用したいと思いobj.type == "type2"ます。それを行う賢い方法はありますか？

編集

このソリューションをさまざまな場所で使用するため、ロジックを html ではなくディレクティブに配置したいと考えています。に応じて、いずれかのディレクティブを「含む」「親」ディレクティブを使用できるのではないかと考えていましたobj.type。どう思いますか？

4

4 に答える 4

6

ng-switchを使用します。

   <div ng-repeat="obj in someArray">
     <span ng-switch="obj.type">
      <div directive-one ng-switch-when="type1"></div>
      <div directive-two ng-switch-when="type2"></div>
     </span>
    </div>
于 2013-09-30T15:55:15.547 に答える
3

必要に応じて、これに ngClass を使用できます。 

<div ng-repeat="obj in someArray">
  <div ng-class"{class1: obj.type == "type1", class2: obj.type == "type2"}"></div>
</div>

この例では、オブジェクトのタイプがクラスに適用されます。詳細については、 http://docs.angularjs.org/api/ng.directive:ngClassを参照してください。

これがデータの解析などである場合は、1 つのディレクティブを使用して内部でケースを処理することができます。

編集：

後で拡張するには、ロジックをサービスに配置し、親ディレクティブで適切な関数を呼び出すことができます。 http://docs.angularjs.org/guide/dev_guide.services.creating_services

于 2013-09-30T15:55:04.273 に答える
0

templateUrl現在の安定版 (1.0.8) では機能を特定することはできません。

HTML

<div ng-controller="MainCtrl">
    <div class="genericDirective" ng-repeat="obj in someArray"></div>
</div>

Javascript

var app = angular.module("myApp", []);

app.controller("MainCtrl", function ($scope) {
    $scope.someArray = [
        {type:"type1",title:"lorem"},
        {type:"type2",title:"ipsum"},
        {type:"type2",title:"dolor"}
    ];
});

app.directive("genericDirective", function(){
    return{
        restrict: "C",
        templateUrl: "genericDirective.html" 
    };
});

genericDirective.html

<div ng-include="thumb.type+'Thumb.html'"></div>

何らかの理由で、ディレクティブをネストすることができなかったので、ng-include代わりに使用しました。（編集：ここで解決された問題）

于 2013-10-02T07:55:06.077 に答える