Question

我正在尝试在Angular JS中实现一个小项目，并且我试图在ng-click上调用一个函数，但这不起作用，但初始加载很好..我想要的是能够回忆起ajax我测试过并且工作但不能通过ng-click调用该函数的参数。

我正在使用asp.net mvc5和angularjs，

Index.chtml：

@{
    ViewBag.Title = "Main";
}

<div class="wrapper wrapper-content" ng-app="mainModule" ng-controller="mainController">

    <div class="row">
        <div class="form-group col-lg-3 col-sm-6">
            <button type="submit" class="btn btn-warning" ng-click="getObject()">Apply</button>
        </div>
    </div>

    <div class="row">
        <div class="col-lg-3 col-sm-6">
            <div>@Html.Partial("_Booking")</div>
        </div>
        <div class="col-lg-3 col-sm-6">
            <div>@Html.Partial("_Commission")</div>
        </div>
        <div class="col-lg-3 col-sm-6">
            <div>@Html.Partial("_Discount")</div>
        </div>
        <div class="col-lg-3 col-sm-6">
            <div>@Html.Partial("_Revenue")</div>
        </div>
    </div>

</div>

@section Scripts {

    @Scripts.Render("~/scripts/main")

}

main.js

var mainModule = angular.module("mainModule", []);

mainModule.controller("mainController", [
       "$scope", "mainFactory", function ($scope, mainFactory) {
           $scope.returnedObject = {};
           mainFactory.getObject()
               .then(function (response) {
                   $scope.returnedObject = response.data;
                   console.log(response.data);
               }, function (error) {
                   console.error(error);
               });
       }
]);

mainModule.factory("mainFactory", function ($q, $http) {
    return {
        getObject: function () {
            var deferred = $q.defer(),
                httpPromise = $http({ method: "GET", url: "/Main/BookingData" });

            httpPromise.then(function (response) {
                deferred.resolve(response);
            }, function (error) {
                console.error(error);
            });

            return deferred.promise;
        }
    };
});

Answer 1

HTML应该更改为以下内容，因为它不是表单提交。

<button type="button" class="btn btn-warning" ng-click="getObject()">

您需要在控制器中绑定getObject函数。它应该是：

    $scope.getObject = function () {
              mainFactory.getObject()
                   .then(function (response) {
                       $scope.returnedObject = response.data;
                       console.log(response.data);
                   }, function (error) {
                       console.error(error);
                   });
    };


    // Run on load
    $scope.getObject();

AngularJS ng-click无效

1 个答案: