angularjs アプリを作成していますが、小さな問題があります。プロジェクトのリストを作成し、いくつかの条件に基づいてそのリストをフィルタリングしています。Web ページで表示すると、すべて問題なく表示され、問題はないようです。
ただし、Chrome でコンソールを表示すると、ページの読み込み時に次の問題が発生します。
GET http://localhost:8000/app/img/customers/%7B%7Bproject.LogoPath%7D%7D 404 (Not Found) jquery-1.9.1.js:6063
GET http://localhost:8000/app/img/customers/%7B%7Bproject.LogoPath%7D%7D 404 (Not Found) angular-scenario.js:11101
最初の GET エラーを発生させてから、groupBy フィルターを実行し (2 回)、2 番目の GET エラーが発生するようです。
本当に奇妙なのは、Web ページのすべてが正しく表示され、ロゴの欠落やその他のプロジェクトの未定義エラーがないことです。
img パスが生成されるコードは次のとおりです。
<article ng-repeat="pm in projects|filter:colorFilter|groupBy:'LeadProjectManagerName'">
<section class="project-section-header">
<h3>{{pm}} <small>{{(projects|filter:pm|filter:{ColorStatus:colorFilter}).length}} projects</small></h3>
</section>
<div class="project project-{{project.ColorStatus}}" ng-class="{'project-last':($index+1) % 4 == 0}" ng-repeat="project in projects|filter:pm|filter:{ColorStatus:colorFilter}">
<img src="img/customers/{{project.LogoPath}}" class="project-logo">
<h1><a href="#/project/{{project.Id}}/dashboard">{{project.Name}}</a></h1>
<p class="project-progress">{{(project.CompletedTasks / project.ScheduledTasks) * 100 || 0}}%</p>
<p class="project-icons"><i class="icon-ok"></i> {{project.CompletedTasks}} <i class="icon-calendar"></i> {{project.ScheduledTasks}} <i class="icon-remove"></i> {{project.MissedTasks}} </p>
</div>
</article>
すべてのデータが表示され、すべてのロゴも表示されています。このエラーがどこから来ているのか、なぜ project.LogoPath の値ではなくリテラル project.LogoPath になっているのかわかりません。
何か案は?