Угловой JS, импортирующий некоторые специфические данные из файла JSON.

Question

Я пытаюсь сделать угловое приложение JS, которое отображает заметки. Все заметки хранятся в файле note.json, и на главной странице приложения отображаются только несколько полей всех заметок. Я хотел бы добавить функцию, открывающую новую страницу, если я нажму на конкретную заметку. На новой странице должны отображаться все данные, относящиеся к нажатой ноте.

У меня есть файл show.html, который является шаблоном выбранной заметки, и note-show-controller.js, который, когда я нажимаю заметку на главной странице, должен импортировать только некоторые данные из примечания .json. Вот код из двух файлов:

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 , который представляет собой массив объекта, всего несколько полей определенного объекта? и если нет, то как я могу решить свою проблему? Вот 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" 
} 
] 

Если это поможет решить мою проблему, я также сделал файл Plunker, который показывает все приложения, вот ссылка:

Plunker File

Спасибо заранее всем, кто может мне помочь.

Answer 1

Все ваши данные находятся в файле JSON. Исходя из этого, я обновил NotesShowController до find() ответ $http.get() и покажу информацию о представлении «Показать».

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>