AngularJSでのPromiseの返し方について（変数に繰り返し値を設定したい）

AngularJS 1.6.4を使って、あるURLから返ってくるJSONの状態を随時ページに反映させたいと考えています。
MainControllerの中で$intervalを使用し、1秒ごとにURLに$httpでリクエストをかけるようにさせたいのですが、

TypeError: Icecast.then is not a function

というエラーが繰り返し出てしまいます。
これはIcecastがPromiseを返していないということだと理解しています。
コードは
Read Icecast metadata using JSON API
を参考に、変更を加えました。
どのようにしたら、$scope.stateにほぼ1秒ごとに状態がセットされるようになるでしょうか。
それとも、別のところが間違っているのでしょうか。
よろしくお願いします。

index.html

lang
1<!doctype html>
2<html ng-app="app">
3  <head>
4    <link rel="stylesheet" type="text/css" href="bower_components/ng-prettyjson/dist/ng-prettyjson.min.css">
5    <script src="bower_components/angular/angular.min.js"></script>
6    <script src="getmetadata.js"></script>
7    <script src="bower_components/ng-prettyjson/dist/ng-prettyjson.min.js"></script>
8  </head>
9  <body>
10    <section id="main" ng-controller="MainController as vm">
11        <div>
12          {{vm.icecast.icestats}}
13        </div>
14        <div ng-show="vm.icecast.icestats.source">live!</div>
15        <div ng-show="!vm.icecast.icestats.source">offline</div>
16        <div>{{state}}</div>
17        <pre pretty-json="vm.icecast.icestats"  />
18    </section>
19  </body>
20</html>

getmetadata.js

lang
1angular
2  .module('app', ['ngPrettyJson'])
3  .controller('MainController', ['$scope', '$interval', 'Icecast', MainController])
4  .factory('Icecast', ['$http', '$q', Icecast]);
5
6function MainController($scope, $interval, Icecast) {
7  var vm = this;
8  var t = $interval(function(Icecast) {
9    Icecast.then(function(data) {
10      vm.icecast = data;
11      if (data.source) {
12        $scope.state = data.source;
13      }
14    });
15  }, 1000);
16}
17
18function Icecast($http, $q) {
19  var d = $q.defer();
20
21  return $http({
22      method: 'GET',
23      url: 'http://live.oguradio.com:8000/status-json.xsl',
24      headers: {
25        'Accept': 'text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8',
26        'Origin': undefined
27      }
28    })
29    .then(success, fail);
30
31  function success(response) {
32    d.resolve(response.data);
33    return d.promise;
34  }
35
36  function fail(response) {
37    d.resolve(response);
38    return d.promise;
39  }
40}

行動規範の内容に同意します

回答1件

ベストアンサー

Icecastが不要です。

javascript
1var t = $interval(function() {
2....
3}

投稿2017/04/20 09:44

pinpikokun

総合スコア376

ogra

2017/04/20 11:03

ご回答の通りにしたところ、エラーが出なくなりました。ありがとうございます。しかし、本来の目的である、ほぼ1秒ごとに状態をチェックして表示を更新するということが、まだできていません。これは別の質問とさせていただきます。

pinpikokun

2017/04/20 12:11

ほぼコピペで以下のサンプルを作ってみましたが１秒毎に結果は出せてるようですよ http://plnkr.co/edit/c036OlqQF2U40Qla1tRK?p=preview

ogra

2017/04/20 12:33

ありがとうございます。教えていただいたリンクを拝見しましたが、18行目を if (data.icestats.source) { と変更する必要がありました。しかしそれでも、ページを閲覧中に実際にURLのサーバーに対して配信と配信停止を切り替えたところ、ページの表示のほうは追従してくれないようです。ページを読み込んだ時点での状態が続いてしまいます。

ogra

2017/04/20 12:35

別の質問とさせていただいた質問は、 https://teratail.com/questions/73199 に書きました。よろしければご覧ください。

行動規範の内容に同意します