オブジェクトの角度コールバックの問題

Question

2つのJSON配列を提供する2つのAPI呼び出しがあります。次のようにテンプレートファイルには、次の詳細を使用

function RDetailController($routeParams, Rep) { 
    var self = this; 
    self.Name = $routeParams.Name; 

    Rep.envGetSingle(self.Name).then(function (response) { 
     // console.log(response.data.length); 
     self.Details = response.data; 
     console.log(self.Details); 

    }); 

    Rep.repGetByCurDate(self.Name).then(function(response) { 
     // console.log(response.data.length); 
     self.report = response.data; 
     console.log(self.report); 
    }); 
    } 

： - - ：

<div class="container"> 
<div> 
<h1>Reports</h1> 
<tr ng-repeat="a in $ctrl.Details"> 
    <th><h4>UI Url: <a>{{a.url}}</a></h4></th> 
    <th><h4>Host IP: {{a.IP}}</h3></th> 
    <th><h4>Release: {{a.mode}}</h3></th> 
</tr> 
</div> 
<div> 
<table class="table table-bordered table-hover data-filter-control="true" " > 
    <thead> 
    <tr> 
     <th>#</th> 
     <th>Screen ID</th> 
     <th>Mast ID</th> 
     <th>Description</th> 
     <th data-filter-control="select">Result</th> 
    </tr> 
    </thead> 
    <tbody> 
    <tr ng-repeat="result in $ctrl.report"> 
     <th></th> 
     <th>{{result.ScreenID}}</th> 
     <th><a href="#!/reports/{{result._id}}">{{result.MastID}}</a></th> 
     <th>{{result.Description}}</th> 
     <th><span ng-class="{ 
      'color-red': result.result === 'Failed', 
      'color-green': result.result === 'Passed'}">{{result.result}} 
    </span></th> 
    </tr> 
    </tbody> 
</table> 
</div> 
</div> 

工場担当者は次のように定義される： - コントローラは、以下のように書かれている

factory('Rep', ['$http', 
function($http) { 
    return { 
    repGetByCurDate : repGetByCurDate 
    envGetSingle: envGetSingle 
    }; 

    function envGetSingle(envName) { 
    return $http.get('/api/envs/currDate/' + envName + '/envDetails').then(complete).catch(failed); 
    } 

    function repGetByCurDate(envName) { 
    return $http.get('/api/envs/currDate/' + envName).then(complete).catch(failed); 
    } 

    function complete(response) { 
    return response; 
    } 

    function failed(error) { 
    console.log(error.statusText); 
    } 
} 

]）

工場が適切なデータを返します。問題は、角度テンプレートファイルのself.Detailsにアクセスしようとしたときに発生します。 self.reportには値がありますがself.Detailsは空です。どのように私はself.Detailsでオブジェクトを永続化することができますか？

Answer 1

詳細変数は、配列内の単一要素です。したがって、テンプレートファイルにアクセスするには、aの代わりに[0] .urlを使用します。これで問題は解決しました。