1

私はAngularJSを初めて使用するので、これは基本的な解決策であることをあらかじめお詫びします。AngularJS を使用して、外部の .json ファイルにアクセスして追加できるようにしたいと考えています。ファクトリ内でデータをハードコーディングすると、正常に表示されます。しかし、Angular の $http を使用してデータにアクセスしようとすると、何も表示されません。

これが私の工場です：

sampleApp.factory('findSamplesFactory', function($http) {
    var samples = $http.get('sample.json').success(function(response) {
        return response;
    });

    var factory = {};
    factory.getSamples = function() {
        return samples;
    };
    factory.insertSamples = function(sampleNumber, sampleBox, sampleRow, sampleLevel) {
        samples.push({
            number: sampleNumber,
            box: sampleBox,
            row: sampleRow,
            level: sampleLevel
        });
    };

    return factory;
});

そして、ここに私が設定したコントローラーがあります

sampleApp.controller('sampleAppController', function ($scope, findSamplesFactory) {
    $scope.samples = findSamplesFactory.getSamples();

    $scope.addSamples = function() {
        var sampleNumber = $scope.newSample.number;
        var sampleBox = $scope.newSample.box;
        var sampleRow = $scope.newSample.row;
        var sampleLevel = $scope.newSample.level
        findSamplesFactory.insertSamples(sampleNumber, sampleBox, sampleRow, sampleLevel);
        $scope.newSample.number = ' ';
        $scope.newSample.box = ' ';
        $scope.newSample.row = ' ';
        $scope.newSample.level = ' ';
    };
});

.json ファイルは正常に検証されます。どんな助けでも大歓迎です！

編集: これは私の完全なアプリのプランカーです: http://plnkr.co/edit/2itJiB?p=preview

4

1 に答える 1

1

私は以下を変更し、それはうまくいきました。$scope.samples = data.data; の変更に注意してください。

sampleApp.controller('sampleAppController', function ($scope, findSamplesFactory) {

    findSamplesFactory.getSamples().then(function(data){
      $scope.samples = data.data;  // I changed this.
    });
  ...Your code as it is...
  });

[プランカー] を確認してください: http://plnkr.co/edit/sZTme6?p=preview

于 2014-09-10T19:54:05.000 に答える