2017-11-16 6 views
0

私はAngularの新機能です。私はいくつかのチュートリアルを見て、いくつかのドキュメントを読んで、コーディングを開始しました。AngularJs - サービスでの作業

これは私のコードです:

angular.module('CourseStoryApp').service("CourseStoryService", ['$http', '$routeParams', function ($http, $routeParams) { 
    return $http({ 
     url: "CourseStoryWebService.asmx/Course", 
     method: "GET", 
     params: { eID: $routeParams.eid } 
    }).then(function (response) { 
     return response.data; 
    }); 
}]); 

angular.module('CourseStoryApp').controller('HeaderController', ['$scope', 'CourseStoryService', function ($scope, CourseStoryService) { 
    CourseStoryService.then(function (data) { 
    $scope.courseStory = data; 
    }); 
}]); 

が、これはサービスを作成し、コントローラにそれを呼び出すための正しい方法は何ですか?

答えて

0

サービスにはCourseStoriesの文脈にあるいくつかの方法が含まれている必要があります。 getの特定のアイテム、deleteとこのようなものが必要な場合があります。これらのユースケースごとに個別のサービスを作成することは愚かなことでしょう。

publiclyのメソッドを作成するには、サービス内の変数thisに割り当てます。

だからあなたのサービスは、次のようになります。

angular 
    .module('CourseStoryApp') 
    .service('CourseStoryService', ['$http', function($http) { 

    // Better to uncouple the service from the router, so you have a generic 
    // 'getStory' method. 
    this.getStory = function(id) { 
     return $http({ 
     url: "CourseStoryWebService.asmx/Course", 
     method: "GET", 
     params: { eID: id } 
     }).then(function(response) { 
     return response.data; 
     }, function() { 
     // Error handling 
     // Maybe write some logs etc. 
     }); 
    }; 
    }]); 

そして、あなたのコントローラは、このように、このサービスを使用することができます:角度から$httpプロバイダは、特定の要求のためのいくつかのショートカットメソッドを持っていることを

angular 
    .module('CourseStoryApp') 
    .controller('HeaderController', ['$scope', '$routeParams', 'CourseStoryService', function($scope, $routeParams, CourseStoryService) { 

    // Consume your Service Method like this. 
    CourseStoryService.getStory($routeParams.eid).then(function(data) { 
     $scope.courseStory = data; 
    }, function() { 
     // Error Handler 
     // Notify user etc. 
    }); 
    }]); 

注意$http.get()などのタイプです。official docsで詳細を読むことができます。

+0

ありがとうございました。 – kby

0

.then()メソッドを使用している場合は、サービスにpromiseというものを実装する必要があります。

あなたが角度に慣れていない場合は、角度2以上について学ぶことをお勧めします。最初のバージョンにいくつかの問題が発生しました

+0

私のサービスで約束をどのように実行するかの例を教えてくれますか? – kby

+0

申し訳ありません、私は間違っていました。 $ HTPPはすでに約束を返す。サービス内の.then()メソッドを削除して、サービス外の.then()メソッドのみを呼び出すようにしてください。 –

関連する問題