我无法在angularjs中隔离控制器和服务代码。 [英] I am not able to segregate the controller and service code in angularjs.

问题描述

我是AngularJs的新手。我正在尝试使用Service.js来调用Web Api。 
如果我直接从控制器调用它是有效的。但是当我尝试使用Service.js隔离代码时，我迷路了。 
任何帮助将不胜感激。 
 
 getSubs函数调用正在APIService中运行。但是无法运行getALL（）。 
请帮忙。

我尝试了什么：



index.cshtml

< div ng-controller =myHttpController> 
< select ng-model =selectUserng-options =x.UserName for x in data>< / select> 
错误：{{error}} 
< / div> 
 ******************** 
 
 app.controller（myHttpController，
函数（$ scope，$ http）{
 $ http.get（'/ api / Values'）。
 then（function（response）{
 $ scope.data = response.data; 
} 
）; 
}）; 
 ************************* 
以上部分正在运作。 
 
但是如果我创建单独的Service.js文件则无法正常工作。 
 
 Index.cshtml // start 
< div ng-controller =serviceController> 
< label id =ser> {{hex}}< / label> 
< p>< / p> 
 
服务
< select ng-model =selectusrng-options =y.UserName for y in testdata>< / select> 
< / div> 
 Index.cshtml //结束
 
 
 Service.js //开始
 app.service（APIService，函数（$ http）{
 
 this.getSubs = function（x）{
 return x.toString（16）; 
} 
 this.getUsers = function（$ http）{
 var url ='/ api / Values'; 
返回$ http.get（url）.then（function（response）{
 return response.data; 
}）; 
} 
 
}）; 
 Service.js // END 
 
 
 Controller.js //启动
 app.controller（serviceController，函数（$ scope，APIService）{
< big>我希望这个已注释的代码部分能够正常工作< / big> 
 // getAll（）; 
 //函数getAll（）{
 // APIService.getUsers（ ）
 // .success（function（d）{
 // $ scope.testdata = d; 
 //}} 
 // .error（function（error）{ 
 // console.log（'哎呀！获取数据时出错了。'）
 //}）; 
 //} 
 
 $范围。 hex = APIService.getSubs（255）; ---- < big>< / big>再次正常工作 
}）; 
 Controller.js //结束

解决方案

范围，

http）{

http.get（ '/ API /值'）。
then（function（response）{

I am new to AngularJs. I am trying to use Service.js to call Web Api. 
It is working if I directly call from controller. But when I try to segregate the code by using Service.js I am getting lost.
Any help will be appreciated.

getSubs function call is working in APIService. But not able to run the getALL().
Please help.

What I have tried:

index.cshtml

<div ng-controller="myHttpController">
<select ng-model="selectUser" ng-options="x.UserName for x in data"></select>
Error: {{error}}
</div>
********************

app.controller("myHttpController",
    function ($scope, $http) {
        $http.get('/api/Values').
            then(function (response) {
                $scope.data = response.data;
            }
            );
    });
*************************
Above part is working. 

But if I create separate Service.js file it is not working.

Index.cshtml// start
 <div ng-controller="serviceController">
            <label id="ser">{{hex}}</label>
            <p></p>
            
            Service
            <select ng-model="selectusr" ng-options="y.UserName for y in testdata"></select>
        </div>
Index.cshtml// End


Service.js //Start
app.service("APIService", function ($http) {

    this.getSubs = function (x) {
        return x.toString(16);
    }
   this.getUsers = function ($http) {
        var url = '/api/Values';
        return $http.get(url).then(function (response) {
            return response.data;
        });
    }

}); 
Service.js //END


Controller.js// Start
app.controller("serviceController", function ($scope, APIService) {
<big>I want this commented portion of code to work</big>
    //getAll(); 
    //function getAll() {
    //    APIService.getUsers()
    //        .success(function (d) {
    //            $scope.testdata = d;
    //        })
    //        .error(function (error) {
    //        console.log('Oops! Something went wrong while fetching the data.')
    //    });
    //}

    $scope.hex = APIService.getSubs(255); ----<big></big>Again It is working
});
Controller.js// End

解决方案

scope,

http) {

http.get('/api/Values'). then(function (response) {

这篇关于我无法在angularjs中隔离控制器和服务代码。的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！