Angular JS、JSONファイルから特定のデータをインポートする

Question

ノートを表示する角型JSアプリケーションを作成しようとしています。 すべてのメモはnote.jsonファイルに保存され、アプリケーションのメインページにはすべてのメモのフィールドが表示されます。 特定のノートをクリックすると、新しいページを開く機能を追加したいと思います。 新しいページには、クリックされたメモを参照するすべてのデータが表示されます。

私は、選択したノートのテンプレートであるnotes.htmlファイルと、メインページ上のノートをクリックするとnote-show-controller.jsを使用してノートから特定のデータをインポートする必要があります.jsonファイル。 ここでは、2つのファイルのコード：

show.html

<div class="col-sm-12"> 
<p>{{note.title}}</p> 
<p>Created By: {{note.user}}</p> 

<p>Description:</p> 
<p>{{note.description}}</p> 

<p>Contents:</p> 
<p>{{note.content}}</p> 
</div> 

ノート・ショーcontroller.js

angular.module('NotesApp').controller('NotesShowController', function($http, $routeParams) { 
var controller = this; 
controller.notes = []; 


$http.get('notes/'+ $routeParams.id).success(function(data){      
    controller.notes = data; 
}) 
}); 

は、私の質問は：それは、JSONファイルからインポートすることが可能ですこれはオブジェクトの配列であり、特定のオブジェクトのフィールドはほんのわずかですか？もしそうでなければ、どうすれば問題を解決できますか？

Plunker File

：ここ は、それは私の問題を解決するのに役立つならば、私はまた、すべてのアプリを表示Plunkerファイルを作りました、ここにリンクがあるnotes.jsonファイル

[ 
{ 
    "id": 1, 
    "users":"Fabio", 
    "title":"questa è la prima nota", 
    "description": "blablablablablablablabla", 
    "content":"èoisèdoifjèosijdfèosjdfèoijsèdofij" 
}, 
{ 
    "id": 2,   
    "users":"Francesco",   
    "title":"questa è la seconda nota", 
    "description": "huhuhuuhuhuhuhuuhuuhuhuh", 
    "content":"èoisèdoifjèosijdfèosjdfèoijsèdofij" 
}, 
{ 
    "id": 3,   
    "users":"Fernando",    
    "title":"questa è la terza nota", 
    "description": "cicicicicicicicicicicici", 
    "content":"èoisèdoifjèosijdfèosjdfèoijsèdofij" 
} 
] 

です

私を助けることができる人に事前に感謝します。

Answer 1

すべてのデータはJSONファイルにあります。これを基に、NotesShowControllerをfind()$http.get()というレスポンスに更新し、Showビューに情報を表示しました。

Working Plunker：

NotesShowController：

angular 
    .module('NotesApp') 
    .controller('NotesShowController', ['$http', '$routeParams', function ($http, $routeParams) { 
     var controller = this; 
     controller.note = {}; 

     $http.get('notes.json').success(function (data) { 
      controller.note = data.find(function (n) { 
       return n.id === $routeParams.id; 
      }); 
     }); 
    }]); 

を表示するビュー：

<div class="col-sm-12"> 
    <p>{{showController.note.title}}</p> 
    <p>Created By: {{showController.note.users}}</p> 

    <p>Description:</p> 
    <p>{{showController.note.description}}</p> 

    <p>Contents:</p> 
    <p>{{showController.note.content}}</p> 
</div>