2016-12-14 52 views
1

如何使用WCF REST服务来填充下拉列表填充下拉列表:如何使用WCF休息AngularJs

首先,这是我的代码获得服务:

service.js

(function (app) { 
app.service("GetCategoryService", function ($http) { 
    this.GetCategory = function() { 
     return $http.get("http://localhost:51458/ServiceRequest.svc/GetCategory/"); 
    }; 
}); 
})(angular.module('entry')); 

Entry.Ctrl

(function (app) { 
 
    'use strict'; 
 
    app.controller('entryCtrl', entryCtrl); 
 
    entryCtrl.$inject = ['$scope']; 
 

 
    function entryCtrl($scope) { 
 
     $scope.pageClass = 'page-entry'; 
 
     //To Get Category 
 
     $scope.Category = function() { 
 
      var promiseGet = GetCategoryService.GetCategory(); 
 
      promiseGet.then(function (pl) { $scope.GetCategory = pl.data }, 
 
        function (errorPl) { 
 
         console.log('Some Error in Getting Records.', errorPl); 
 
        }); 
 
     } 
 
    } 
 
})(angular.module('entry'));

这是entry.html

<div class="dropdown"> 
    <select ng-model="Category" ng-options="item.ITEM_TEXT for item in Category"></select> 
</div> 

WCF输出JSON,如: [{"ITEM_TEXT":"INTERNAL APP"},{"ITEM_TEXT":"INTERNAL IT"}]

我不知道怎么这个传递给HTML,我在做什么像这样不管用。请帮忙。感谢

+0

你忘注入在控制器中的服务...是你得到任何具体的错误? – deostroll

+0

没有任何错误。我知道这是缺少注入控制器。但我不知道如何去做 – Stfvns

+0

当我在entryCtrl.js hv errror中添加'$ scope.Category();'在ChildScope中没有定义'GetCategoryService' $ scope.Category' – Stfvns

回答

2

确保您已设置ng-model不同于array name,也注入了服务到您的控制器,

entryCtrl.$inject = ['$scope', 'GetCategoryService']; 

DEMO

var app = angular.module('todoApp', []); 
 

 
app.controller("dobController", ["$scope", 
 
    function($scope) { 
 
    
 
    $scope.Category = [{"ITEM_TEXT":"INTERNAL APP"},{"ITEM_TEXT":"INTERNAL IT"}]; 
 
    } 
 
]);
<!DOCTYPE html> 
 
<html ng-app="todoApp"> 
 

 
<head> 
 
    <title>To Do List</title> 
 
    <link href="skeleton.css" rel="stylesheet" /> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js"></script> 
 
    <script src="MainViewController.js"></script> 
 
</head> 
 

 

 
<body ng-controller="dobController"> 
 
    <select ng-model="selected" ng-init="selected = Category[0]" ng-options="item.ITEM_TEXT for item in Category"></select> 
 
</body> 
 

 
</html>

+0

请使用像这样的函数编辑.. @Sajeetharan – Stfvns

+0

@Stfvns我没有得到它 – Sajeetharan

+0

使用像'entryCtrl.js'中的结构。当我使用像你的答案它不是从我的WCF休息服务得到@Sajeetharan – Stfvns