私は以下の要素を持っています。オブジェクトの配列内の条件に基づいた角度の表示要素
<div> My element</div>
、以下の目的:
$scope.myObject = {'life_log' : [{status: 'ALIVE'},{status: 'DEAD'}]}
どのように私はすべてのステータスがALIVEされている場合にのみ、要素を表示することができます。
私は変数にng-showを使用する方法を知っていますが、このような状態はどうですか?
私は以下の要素を持っています。オブジェクトの配列内の条件に基づいた角度の表示要素
<div> My element</div>
、以下の目的:
$scope.myObject = {'life_log' : [{status: 'ALIVE'},{status: 'DEAD'}]}
どのように私はすべてのステータスがALIVEされている場合にのみ、要素を表示することができます。
私は変数にng-showを使用する方法を知っていますが、このような状態はどうですか?
配列をループし、すべてのステータスが「ALIVE」であるかどうかをチェックする関数を作成する必要があります。それとも、アレイ上の削減方法を使用します。
$scope.allStatusesAreAlive = $scope.myObject.life_log.reduce(function(a, b) {
if (a === false) return false;
if (b.status === 'DEAD') return false;
return true;
}, true);
$ scope.allStatusesAreAliveがtrueの場合、その後、あなたの要素を表示することができます。
<div ng-if="allStatusesAreAlive"> My element</div>
素晴らしいです。私は関数を使用しようとしましたが、myobjectは常に空です。ビューは以前に構築されているので、私は推測しています。どうすれば修正できますか? – KingKongFrog
myObjectのデータを取得するAJAXリクエストを作成している場合、ビューを更新するにはangleを指定する必要があります。 $ timeout(ビューを再表示するダイジェストサイクルをトリガーする$ timeoutの中にコードを置くことでこれを行うことができます。$ timeoutはダイジェストサイクルをトリガーする$ rootScope。$ digestを呼び出します)。あなたのコントローラに$ timeoutサービスを注入し、この$ timeout(function(){ここでmyObjectを更新}のように使用する必要があります)。 –
また、 'ALIVE'をフィルタリングして長さを比較するとうまくいくと思います。読みやすいです。この[フィドル](https://jsfiddle.net/awolf2904/zeuzzp6w/)を見てください。削減はまた、それを検出する良い方法です。あなたのコードは少し最適化できると思います。フィドルを見てください。 – AWolf
あなたはこの
angular.forEach($scope.myObject.life_log, function(item){
if(item.status !=='ALIVE'){
$scope.isAlive = false;
break;
}else{
$scope.isAlive = true;
}
});
ような何かを行うことができます
あなたのhtmlで
<div data-ng-if="isAlive">My element</div>
// This is here to make it configurable
$scope.keys = Object.keys($scope.myObject);
// In this case you have the "life_log" key
$scope.keys.forEach(k => {
$scope.myObject[k].forEach((d) => {
// our object here is myObject["life_log"];
// obj is a temp array to check the amount of statuses that are dead
var obj = [];
d["allAlive"] = d.status.forEach(s =>{
if(s == 'DEAD'){
obj.push("Dead");
}
});
if(obj.length > 0){
d.allAlive = false
}else{
d.allAlive = true;
}
});
});
<div ng-if="myObject[o].allAlive>
ALL ALIVE
</div>
次のリンク
https://plnkr.co/edit/ermeKk1dBX8D54pL7vHQ?p=preview
角度コードチェック:
$scope.myObject = {'life_log' : [{status: 'ALIVE'},{status: 'DEAD'}]}
$scope.val=true;
for(i=0;i<$scope.myObject.life_log.length;i++){
if($scope.myObject.life_log[i].status != "ALIVE")
$scope.val=false;
}
htmlコード:あなたはおそらくNG-IFを使用すると思いますが、そこ可能性が一般的に
<div ng-show="val">My element</div>
をmyObject.life_logの使い方に応じて別の方法がありますか? ng-repeatでは、コレクション内のすべてのオブジェクトを繰り返し処理しますか?他の方法ですか? – jbrown