2017-02-07 24 views
0

角度jsは単純な式のように表示されません。私はコードの下で実行することを望んでいますが、希望はありません。誰も私を助けることができます。角度Jが正しく動作していません

以下のコードは、表示するためのコードです。

`<html> 
 
<head> 
 
    <title></title> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script> 
 
    <script type="text/javascript" src="/../../Scripts/angularsample.js"></script> 
 
</head> 
 
<body ng-app="spiceApp"> 
 
    <div> 
 
     <div ng-controller="SpicyController"> 
 
      <p> lets try some code by using service </p> 
 
      <input ng-init="message='Girish'" ng-model="message" /> 
 
      <button ng-click="notify(message);">Notify{{1+2}}</button> 
 
      <p>alert will display only by clicking three times.</p> 
 
     </div> 
 
     <div ng-controller="List"> 
 
      <button ng-click="bringList()">getList</button> 
 
      <table> 
 
       <tr ng-repeat="app in appslist"> 
 
        <td> 
 
         {{app.Name}} 
 
        </td> 
 
       </tr> 
 
      </table> 
 
      </div> 
 
    </div> 
 
</body> 
 
</html>`

jsのコード

var myApp = angular.module('spiceApp', []); 
 

 
myApp.controller('SpicyController', ['$scope', '$http', 'userService', , function ($scope, $http, userService) { 
 

 
    //below code is using sservice 
 
    $scope.notify = function (msg) { 
 
     userService(msg); 
 
    }; 
 
    
 
}]); 
 

 

 
myApp.controller('List', ['$scope', 'getList', function ($scope, getList) { 
 
    $scope.bringList = function() { 
 
     getList.getAppsList().then(function (list) { 
 
      $scope.appslist = list; 
 
     }); 
 
    }; 
 

 
}]); 
 

 
myApp.factory('getList', ['$http',function ($http) { 
 
    //this code for getting list from controller. 
 
    return getList.getAppsList=function(){ 
 
     $http({ 
 
      method: 'GET', 
 
      url: 'Home/GetAppsList' 
 
     }) 
 
    .success(function (response) { 
 
     return response.data; 
 
    }, function (error) { 
 
     console.log(error); 
 
    }); 
 
    } 
 
}]); 
 

 
myApp.factory('userService', ['$window', function (win) { 
 
    var msgs = []; 
 
    return function (msg) { 
 
     msgs.push(msg); 
 
     if (msgs.length == 3) { 
 
      win.alert(msgs.join('\n')); 
 
      msgs = []; 
 
     } 
 
    }; 
 

 
}]);`

私は間違っているところを教えてください。何も働いていない。式はouptutの{{1 + 2}}のように表示されます。その依存関係が台無しにされている2つの昏睡と

myApp.controller('SpicyController', ['$scope', '$http', 'userService', , function 

+0

あなたはコンソールでエラーを持っていますか? – Alteyss

+0

コンソールでエラーが発生しました: –

+0

ReferenceError:getListが定義されていません atオブジェクト。 (angularsample.js:36)Object.invokeで 。(angular.js:4708)オブジェクトで $取得(angular.js:4547)Object.invokeで (angular.js:4708)angular.jsで :4507 at d(angular.js:4654) e(angular.js:4678) at Object.invoke(angular.js:4700) P.instance(angular.js:10177) n angle.js:9096) (匿名)@ angular.js:13642 –

答えて

1

現在地タイプミスを持っています。

+0

テンプレートが正常に機能しています。サービスからコントローラ –

+0

にリストを返すことができませんあなたはそれを見てみることができます –

0

私は同じ方法で別の方法で試しましたが、今はうまくいきました。

var myApp = angular.module('spiceApp', []); 
 

 
myApp.controller('SpicyController', ['$scope', '$http', 'userService',function ($scope, $http, userService) { 
 

 
    //below code is using sservice 
 
    $scope.notify = function (msg) { 
 
     userService(msg); 
 
    }; 
 
    
 
}]); 
 

 
myApp.factory('userService', ['$window', function (win) { 
 
    var msgs = []; 
 
    return function (msg) { 
 
     msgs.push(msg); 
 
     if (msgs.length == 3) { 
 
      win.alert(msgs.join('\n')); 
 
      msgs = []; 
 
     } 
 
    }; 
 

 
}]); 
 

 

 
myApp.controller('List', ['$scope', 'getList', function ($scope, getList) { 
 
    
 
    $scope.bringList = function() { 
 
     getList.getAppsList.then(function (data) { 
 
      $scope.appslist = data; 
 
     }); 
 

 
    }; 
 

 
}]); 
 

 
var getList = angular.module("spiceApp").factory("getList", ['$http', function ($http, getList) { 
 
    return { 
 
     getAppsList: (function (response) { 
 

 
      return $http({ 
 
       method: 'GET', 
 
       url: 'GetAppsList' 
 
      }) 
 
      .then(function (response) { 
 
       console.log("coming from servicejs", response.data); 
 
       //return data when promise resolved 
 
       //that would help you to continue promise chain. 
 
       return response.data; 
 
      }); 
 
     })() 
 
    }; 
 
    return getList; 
 
}]);

関連する問題