Benötigen Sie eine Beratung in angularjs SPA

Question

Ich schreibe SPA, SPA, die fast die gleiche Struktur (DOM) die ganze Zeit (außer Autorisierungsformular) hat. Visual es sieht völlig gleich aus, aber es gibt wenig Unterschiede zwischen ihnen. Modelle unterscheiden sich in verschiedenen Situationen und das Verhalten der Anwendung hängt davon ab, welches Modell zu diesem Zeitpunkt verwendet wird. Zum Beispiel ein Modell wie folgt aussieht:

<table class="matrix" ng-if="search_result_type=='find_company'"> 
    <tr ng-class="{matrix_row: !row.show}" ng-style="multiStyle(row, this)" class="animation" ng-repeat="row in search_result | filter:cacheTemplate track by $index"> 
     <td class="properties">{{row.name}}</td> 
     <td class="properties" ng-if="isArray(row.contact)" ng-click="row.close!='disable' && row.show!=true ? row.show=true : null" colspan="{{row.show ? 2 : 1}}"> 
      <div ng-show="!row.show" ng-class="{multi_close : isMulti(row)}">{{row.contact[0].name}}</div> 
      <div ng-repeat="ctx in row.contact track by $index" class="matrix_row multi_cell" style="line-height: 3; width: 100%; position: relative;" ng-show="row.show" ng-click="row.close!='disable' ? alert('загрузка контакта '+ ctx.name) : null"> 
       <div style="display: inline-block; width: 49%;">{{ctx.name}}</div> 
       <div style="display: inline-block; width: 49%;">{{ctx.phone}}</div> 
       <div class="block" ng-if="$index==row.contact.length-1" ng-mouseover="row.close='disable'" ng-mouseleave="row.close='enable'" ng-click="row.close!='enable'? row.show=false : null"></div> 
      </div> 

     </td> 
     <td class="properties" ng-if="!isArray(row.contact)">{{row.contact}}</td> 
     <td class="properties" ng-show="!row.show">{{row.company_phone}}</td> 
     <td class="properties">{{row.Legal_address}}</td> 
    </tr> 
</table> 

Zweites Modell:

<table class="matrix" ng-if="search_result_type=='find_calculation'"> 
    <tr ng-class="{matrix_row: !row.show}" class="animation" ng-click="loadCalculation(row.id)" ng-style="multiStyle(row, this)" ng-repeat="row in search_result | filter:cacheTemplate track by $index"> 
     <td class="properties">{{row.name}}</td> 
     <td class="properties">{{row.a_limit | currency:'RUB '}}</td> 
     <td class="properties">{{row.total_price | currency:'RUB '}}</td> 
     <td class="properties">{{row.amount}}</td> 
     <td class="properties">{{row.date}}</td> 
    </tr> 
</table> 

Und die letzte:

<table class="matrix" ng-if="search_result_type=='load_calculation'" ng-repeat="park in parks track by $index" ng-init="parentIndex = $index"> 
     <tbody> 
      <tr ng-repeat="process in processes | filter : { park: parentIndex } track by $index"> 
       <td class="properties">{{process[1]}}</td> 
       <td class="properties">{{process[2]}}</td> 
       <td class="properties">{{process[3]}}</td> 
       <td class="properties">{{process[4]}}</td> 
       <td class="properties">{{process[5]}}</td> 
       <td class="properties">{{process[6]}}</td> 
      </tr> 
     </tbody> 
    </table> 

Ich suche nicht für Antwort, aber für Beratung. Wie viele Controller muss ich verwenden? Eine für jedes Modell? Und wenn ich diese HTML-Struktur völlig gleich mache, wird es besser?

Answer 1

I würde nur 1 Controller verwenden, mit HTML, die ein paar Sachen in sich hat wie

als auch eine Fabrik für diesen Controller schreiben könnte, die abhängig Sachen behandelt. Ich sehe keine Notwendigkeit für mehrere Controller, aber ich denke, es ist sehr abhängig von Ihrem Code, wenn Sie einen oder mehrere Controller verwenden.