Angular JS，從JSON文件導入一些特定數據

Question

我正在嘗試制作一個顯示筆記的有角JS應用程序。 所有筆記都存儲在note.json文件中，應用程序的主頁僅顯示所有筆記的少數字段。 如果要單擊一個特定的注釋，我想添加打開新頁面的功能。 新頁面應顯示與單擊的注釋有關的所有數據。

我有一個show.html文件，它是所選筆記的模板，還有一個notes-show-controller.js，當我單擊主頁上的筆記時，應僅從note.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>

notes-show-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文件來顯示所有應用程序，這里是鏈接：

柱塞文件

在此先感謝任何可以幫助我的人。

Answer 1

您的所有數據都在JSON文件中。基於此，我更新了NotesShowController以找到（） $http.get()響應，並在“顯示”視圖上顯示信息。

工作柱塞 ：

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>