0

我要做的就是通过 ng-Click 和 $http.get 调用我的后端。然后，我尝试设置要显示在我的 html 中的项目的值。这是我的结构。没有真正得到任何错误，因此有关如何查看我的代码不正确位置的任何信息都会很棒。谢谢。

HTML

<head>
<title>Hello</title>
<script src="~/Scripts/profileController.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.min.js">    </script>


<section ng-controller="profileController as vm">

    <div class="container">

        <div style="padding-left:20px; padding-right: 1000px; height:700px;">

            <h2>Create Profile</h2>

            <img src="app/img/user.png" />
            <label for="eventName">UserName: {{vm.newUser.UserName}}</label>
            <input id="eventName" ng-model="UserName" type="text" placeholder="Edit User Name" />
            <label for="eventName">Name: {{vm.nameName}}</label>
            <input id="eventName" ng-model="nameName" type="text" placeholder="Edit Name" />
            <label for="eventName">Age: {{vm.age}}</label>
            <input id="eventName" ng-model="age" type="text" placeholder="Edit age" />
            <label for="eventName">College: {{vm.college}}</label>
            <input id="eventName" ng-model="college" type="text" placeholder="Edit college" />
            <label for="eventName">City: {{data.city}}</label>
            <input id="eventName" ng-model="name" type="text" placeholder="Edit city" />

            <a class="btn btn-default btn-lg" ng-click="vm.getUserList()">Register</a>

        </div>
    </div>


</section>

控制器/工厂

 angular.module("app", [])
 .controller('profileController', ['$scope', 'profileFactory', function ($scope, profileFactory) {

var vm = this;
this.getUserList = function () {

    profileFactory.getUserList($scope).success(function (data) {
        $scope.UserList = data;
    });
}
 }])

 .factory('profileFactory', ['$http', '$q', function ($http, $q) {
var urlBase = "/api/saveUser";
var dealerProcessReportSetupFactory = {

    getUserList: function () {

        return $http.get(urlBase + "/UserList");
    }
};

return dealerProcessReportSetupFactory;
 }]);

API 控制器

 public class profileController : ApiController
{
    // GET api/DealerProcessReportSetup
    [HttpGet]
    [ActionName("saveUser")]
    public tblOwl getUserList()
    {
        using (VSCDevEntities db = new VSCDevEntities()) 
        {
            var Owl = (from z in db.tblOwls select z).FirstOrDefault();

            return Owl;

        }

    }
}
4

1 回答 1

3

下面的东西不见了

  1. ng-app指令必须在body/html标记上，例如ng-app="app".
  2. 脚本应加载到页面的标题中。
  3. 在加载任何其他使用 angular 对象的文件之前，您必须先加载 angular.js

参考文献应该是

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.min.js"></script>
<script src="~/Scripts/profileController.js"></script>

更新

当你使用controllerAs语法时，你的控制器应该使用this关键字，或者至少你应该getUserList()在这个关键字中定义你使用的方法ng-click="vm.getUserList()"。

控制器

 angular.module("app", [])
 .controller('profileController', ['$scope', 'profileFactory', function ($scope, profileFactory) {
   var vm = this;
   this.getUserList = function () {

      profileFactory.getUserList($scope).success(function (data) {
          $scope.UserList = data;
      });
   } 
 }])
于 2015-06-16T19:51:03.867 回答