I need to read the following JSON text from my fetched database, below was my sample code:

{{questionData1[0].qst_cnt_options[0].left}}

The real data in qst_cnt_options was:

[{left:'Benda Hidup',right:'Benda Mati'}] //Fetched from database and as text

When I tried to read back, the output was only [. How to solve this problem?

Since the fetched value from the database is simple text, use JSON.parse to parse into a json object and retrieve it.

[{left:'Benda Hidup',right:'Benda Mati'}] this is a string, so returning [ as first value.

Method1: just return the JSON parsed value from the contrller,

In your controller:

app.controller('myCtrl',function($scope){
    $scope.qst_cnt_options =  $scope.questionData1[0].JSON.parse(qst_cnt_options)
});

In your view:

{{qst_cnt_options[0].left}}

Method2:

app.controller('myCtrl',function($scope){
    $scope.qst_cnt_options =  questionData1[0].JSON.parse(qst_cnt_options)

    $scope.parJson = function (json) {
            return JSON.parse(json)[0];
    }
});

View:

{{qst_cnt_options.parJson(qst_cnt_options.qst_cnt_options)}}

more