如何将提交功能添加到我的ng-controller

时间:2014-07-03 16:49:45

标签: javascript angularjs

我正在努力学习角度,请原谅我的愚蠢错误和无知。话虽如此, 我在创建控制器ProducerCtrl时向数据库添加数据。这在我添加任何其他内容之前有效。当我添加addname函数时,它会中断我的数据提取。我确信我做错了,因为我不知道自己在做什么。我想要这些 两位代码工作。也许我需要将一个或两个移动到另一个区域。

<html><head>
    <title></title>
    <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.1/angular.min.js"></script>
<script>
var eventApp = angular.module('eventApp', []);

var szAction = "/GoGetData";
var szAction2 = "/GoPostData" })";

eventApp.controller('ProducerCtrl', ['$scope', '$http', function (scope, http) {
    http.get(szAction).success(function (data) {
        scope.producer = data;
    });

    $scope.addName = function () {
        http.post(szAction2, scope.producer);

    };
}]);
</script>
</head>
<body>
<div ng-app="eventApp">
    <div ng-controller="ProducerCtrl">
        Name:<input ng-model="producer.Name" type="text" /><br>
        Hello {{producer.Name}}

        <form ng-submit="addName()">
            <input ng-model="producer.Name" type="text">
            <input type="submit" value="add">
        </form>
    </div>
</div>
</body></html>

1 个答案:

答案 0 :(得分:0)

我对您的代码进行了一些更改。单击“添加”将提示警报。

您的HTML:

<body>
    <div ng-app="eventApp">
        <div ng-controller="ProducerCtrl">
            Name:<input ng-model="producer.Name" type="text" /><br />
            Hello {{producer.Name}}

            <form ng-submit="addName()">
                <input ng-model="producer.Name" type="text" />
                <input type="submit" value="add" />
            </form>
        </div>
    </div>
<body>

你的角色代码:

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

eventApp.controller('ProducerCtrl', ['$scope', '$http', function ($scope, $http) {
    $scope.producer = { Name : '' };

    $scope.addName = function () {
        alert($scope.producer.Name);
    };
}]);

请参阅here

查看here以查看$ http。