Question

我正在尝试使用angularjs开发一个简单的Web应用程序我有一个使用entityframework city创建的表database first。

我在我的项目中添加了angularjs nuget。并在我的项目service和controller中创建了2个文件，如下所示：

控制器

MyApp.controller('UpdateController', function ($scope, CityService) {

    getCities();

    function getCities() {

        CityService.getCities()

            .success(function (cities) {

                $scope.cities = cities;

            })

            .error(function (error) {

                $scope.status = 'Unable to load customer data: ' + error.message;

            });

    }

});

服务：

MyApp.factory('CityService', ['$http', function ($http) 
{
    var urlBase = 'http://localhost:37404/api';

    var CityService = {};

    CityService.getCities = function () {

        return $http.get(urlBase + '/default1');

    };

    return CityService;

}]);

我使用webapi传递数据，如您所见：

namespace MvcApplication8.Controllers
{
    public class Default1Controller : ApiController
    {
        private testDBEntities db = new testDBEntities();

        // GET: api/ManageStudentsInfoAPI  
        public IQueryable<City> GetStudent()
        {
            return db.Cities;
        }   
    }
}

以下是我的观点：

<header>
    <div class="content-wrapper">
        <div class="float-left">
            <p class="site-title">
                <a href="~/">ASP.NET Web API</a></p>
        </div>
    </div>
    <script src="~/Scripts/jquery-1.7.1.js"></script>
    <script src="~/Scripts/jquery-1.7.1.min.js"></script>
    <script src="~/Scripts/angular.js"></script>
    <script src="~/Scripts/angular.min.js"></script>
    <script src="~/MyAngularFile/Service.js"></script>
    <script src="~/MyAngularFile/Controller.js"></script>
</header>
<div id="body">
    <div ng-controller="UpdateController">    
        <table class="table">    
            <tr> 

                <th>Id</th>

                <th>Name</th>

                <th>Country</th>

            </tr>

            <tr ng-repeat="a in cities">

                <td>{{a.Id}}</td>

                <td>{{a.Name}}</td>

                <td>{{a.Country}}</td>

           </tr>

        </table>
    </div>
</div>

但结果是这样的：

我的浏览器错误：

Answer 1

试试这个：

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

然后，在html中：

<div id="body" ng-app="MyApp">

使用angularjs获取数据不能正常工作

1 个答案: