Wie zeigt man einen anderen Bereichswert in der Ansicht an, der einem anderen Wert entspricht?

Question

Ich bin Neuling zu eckig. Ich habe zwei Bereichsvariablen, d. H. $scope.jsonData und $scope.dbdatas. Ich möchte einen Wert von $scope.jsonData anzeigen, der $scope.dbdatas.name entspricht. Bitte überprüfen Sie meine code. Ich habe meine Wunschausgabe im Code erwähnt.

Ausblick:

<div ng-app="myApp"> 
    <div ng-controller="TestCtrl"> 
    <div class="col-md-4 col-lg-4 col-xs-6" style="padding: 10px" ng-repeat="dbdata in dbdatas"> 
     <div> 
     {{dbdata.name}} : <span class="list_text">{{dbdata.value}}</span> 
          <!--something like {{dbdata.name}} : <span show-value class="list_text">{{dbdata.value}}</span>--> 

     </div> 
</div> 
</div>  

var app = angular.module('myApp', []); 
app.controller('TestCtrl',function($scope){ 
$scope.jsonData=[{"_id":"56f90a9a51ec8f20e786a9e7","name":"Eleget","options":[{"key":"Y","value":"Once"},{"key":"M","value":"More than once"}]},{"_id":"56f90a9a51fs8f20e786a9e7","name":"MoliRet","options":[{"key":"L","value":"Let"},{"key":"R","value":"Ret"}]}]; 

$scope.dbdatas=[{name:'MoliRet',value:'L'},{name:'MoliRet',value:'R'},{name:'Eleget',value:'M'}]; 
}); 

/*app.directive('showValue',function(){ 
return{ 
    restrict:'A', 
    link:function(scope,ele,attr){ 

    } 
} 
});*/ 

Stromausgang

MoliRet: L

MoliRet: R

Eleget: M

Wunsch Ausgang

MoliRet: Lassen Sie

MoliRet: Ret

Eleget: Mehr als einmal

Answer 1

Sie können angular.ForEach zu Match Daten von beiden Scope-Variablen und schiebe die Daten zu einem Array $ Scope. Bitte werfen Sie einen Blick auf die folgende Lösung.

<div ng-app="myApp"> 
    <div ng-controller="TestCtrl"> 
     <div class="col-md-4 col-lg-4 col-xs-6" style="padding: 10px" ng-repeat="dbdata in dbdatas"> 
      <div> 
       {{dbdata.name}} : <span class="list_text">{{dbdata.value}}</span> 
      </div> 
     </div> 
     <div ng-repeat="expect1 in expectations">{{expect1.name}}: {{expect1.value}}</div> 
    </div> 
</div> 

---

$scope.dbdatas=[{name:'MoliRet',value:'L'},{name:'MoliRet',value:'R'},{name:'Eleget',value:'M'}]; 
    $scope.expectations= []; 
    angular.forEach($scope.dbdatas,function(value1){ 
    angular.forEach($scope.jsonData,function(value2){ 
    if(value1.name == value2.name){ 
     angular.forEach(value2.options,function(value3){ 
     if(value3.key == value1.value){ 
      $scope.expectations.push({ 
      "name" : value2.name, 
      "value": value3.value}); 
      } 
     }); 
    } 
    }); 
}); 

Erwartete Ausgabe wird

MoliRet sein: Ret

Eleget:

MoliRet Lassen Mehr als einmal

Answer 2

Working Fiddle

HTML:

<div ng-app="myApp"> 
    <div ng-controller="TestCtrl"> 
      <div class="col-md-4 col-lg-4 col-xs-6" style="padding: 10px" ng-repeat="item in jsonData"> 
      <div ng-repeat='option in item.options'> 
       <div ng-show="isInArray(option.key)"> 
        {{item.name}}: {{option.value}} 
       </div> 
      </div> 
      </div> 
     </div> 
</div> 

JavaScript:

var app = angular.module('myApp', []); 
app.controller('TestCtrl',function($scope){ 

$scope.isInArray = function(key){ 
    var returnValue = false;  
    for(var i=0;i<$scope.dbdatas.length;i++){ 
    if($scope.dbdatas[i].value==key){ 
     returnValue = true;  
     break; 
    } 

    } 

    return returnValue 

} 

$scope.jsonData=[{"_id":"56f90a9a51ec8f20e786a9e7","name":"Eleget","options":[{"key":"Y","value":"Once"},{"key":"M","value":"More than once"}]},{"_id":"56f90a9a51fs8f20e786a9e7","name":"MoliRet","options":[{"key":"L","value":"Let"},{"key":"R","value":"Ret"}]}]; 

$scope.dbdatas=[{name:'MoliRet',value:'L'},{name:'MoliRet',value:'R'},{name:'Eleget',value:'M'}]; 
}); 

Ausgang:

Eleget: Mehr als einmal

MoliRet: Ret

Hoffnung, die Ihr Problem lösen:

MoliRet lassen.

Answer 3

Ich würde vorschlagen, Sie müssen eine eindeutige Optionstabelle in einem json speichern und eckigen benutzerdefinierten Dienstfilter verwenden, um den relativen Schlüssel zu behandeln "schau auf den Plunker". Sie können diesen benutzerdefinierten Filter in jedem Controller und in jeder Ansicht verwenden.

Hier benutzerdefinierte Filter

app.filter('myFilter', ['$filter', function ($filter) { 
    return function (data, param) { 
    var output = $filter('filter')(data, {key:param},true); 
    return (param && output.length) ? output[0].value : ''; 
    }; 
}]); 

Hier ist ein funktionierendes plunker .Hope, die helfen.